B4J Question [SOLVED] BCTextEngine Example (BCTextExample)

mmieher · Jul 16, 2022

What is the purpose of the B4XView pnl?

B4X:

'B4i - don't miss the inline OBJC code in the main module.
Private Sub B4XPage_Created (Root1 As B4XView)
    Root = Root1
    Root.LoadLayout("1")
    TextEngine.Initialize(Root)
    BBCodeView1.TextEngine = TextEngine
    Dim btn As Button
    #if B4i
    btn.Initialize("btn", btn.STYLE_SYSTEM)
    #Else If B4J or B4A
    btn.Initialize("btn")
    #End If
    Dim xbtn As B4XView = btn
    If xui.IsB4i Then xbtn.SetColorAndBorder(xui.Color_Transparent, 1dip, xui.Color_Black, 2dip)
    xbtn.Text = "Click!"
    xbtn.SetLayoutAnimated(0, 0, 0, 100dip, 40dip)
    
    '    ----------------------------------------------------------------------------
    '    What is the purpose of this B4XView?  How is it referenced?
    Dim pnl As B4XView = xui.CreatePanel("")
    pnl.SetLayoutAnimated(0, 0, 0, 200dip, 120dip)
    '    ----------------------------------------------------------------------------
    
    BBCodeView1.Views.Put("btn", btn)
    BBCodeView1.Text = $"[Alignment=Center][TextSize=20][b][u]This is the title$"$
    
End Sub

TILogistic · Jul 16, 2022

put customlistview

BBCodeView1.Views.Put("clv", pnl)

Do you wonder whether it is possible to add more complex views?
Sure: [vertical=30][view=clv/][/vertical]

B4X:

    Dim xbtn As B4XView = btn
    If xui.IsB4i Then xbtn.SetColorAndBorder(xui.Color_Transparent, 1dip, xui.Color_Black, 2dip)
    xbtn.Text = "Click!"
    xbtn.SetLayoutAnimated(0, 0, 0, 100dip, 40dip)
    
    Dim pnl As B4XView = xui.CreatePanel("")
    pnl.SetLayoutAnimated(0, 0, 0, 200dip, 120dip)
    pnl.LoadLayout("CustomListView")
    
    For i = 1 To 50
        CustomListView1.AddTextItem($"Item ${i}"$, "")
    Next
    
    BBCodeView1.Views.Put("clv", pnl)
    BBCodeView1.Views.Put("btn", btn)

    BBCodeView1.Text = _
$"[Alignment=Center][TextSize=30][b][u][Font=MyFont Size=50]This is the title [/Font][FontAwesome=0xF034/] [FontAwesome=0xF035/][/u][/b][/TextSize][/Alignment]
Emoji made of multiple "characters": ?‍? and a flag: [TextSize=30][e=??/][/TextSize]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc fermentum elit vitae nisi faucibus, vitae lacinia turpis mattis.
Lets add a [Color=#ff0000][b]button:[/b][/color] [View=btn Vertical=10/]  and more text here...

We can also add links, for example: [url]https://www.google.com[/url]. You can click on the link. The title will be updated.
Here is a nice logo: [img FileName="logo.png" width=50/]

Do you wonder whether it is possible to add more complex views?
Sure: [vertical=30][view=clv/][/vertical]

mmieher · Jul 16, 2022

Omar Parra A. said:

put customlistview

B4X:

    Dim xbtn As B4XView = btn
    If xui.IsB4i Then xbtn.SetColorAndBorder(xui.Color_Transparent, 1dip, xui.Color_Black, 2dip)
    xbtn.Text = "Click!"
    xbtn.SetLayoutAnimated(0, 0, 0, 100dip, 40dip)
   
    Dim pnl As B4XView = xui.CreatePanel("")
    pnl.SetLayoutAnimated(0, 0, 0, 200dip, 120dip)
    pnl.LoadLayout("CustomListView")
   
    For i = 1 To 50
        CustomListView1.AddTextItem($"Item ${i}"$, "")
    Next
   
    BBCodeView1.Views.Put("clv", pnl)
    BBCodeView1.Views.Put("btn", btn)

    BBCodeView1.Text = _
$"[Alignment=Center][TextSize=30][b][u][Font=MyFont Size=50]This is the title [/Font][FontAwesome=0xF034/] [FontAwesome=0xF035/][/u][/b][/TextSize][/Alignment]
Emoji made of multiple "characters": ?‍? and a flag: [TextSize=30][e=??/][/TextSize]
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nunc fermentum elit vitae nisi faucibus, vitae lacinia turpis mattis.
Lets add a [Color=#ff0000][b]button:[/b][/color] [View=btn Vertical=10/]  and more text here...

We can also add links, for example: [url]https://www.google.com[/url]. You can click on the link. The title will be updated.
Here is a nice logo: [img FileName="logo.png" width=50/]

Do you wonder whether it is possible to add more complex views?
Sure: [vertical=30][view=clv/][/vertical]

View attachment 131458

Thank you. The example never does anything with pnl (as near as I can tell).

TILogistic · Jul 16, 2022

see:

[work in progress] BCText - Cross platform text engine

BCText is a custom and cross platform text engine. It can be used for all kinds of things such as cross platform implementation of CSBuilder, rich text view, specialized text layouts and other cases where you need full control over the text layout. More information next week. It is not 100%...

www.b4x.com

mmieher · Jul 16, 2022

I am feebling on doing the opposite. I want to load a BBCodeView into a CLV. Not enough time spent yet, but you are listening.

That Navy thing on the right-side is the Divider Color (?). The Khaki view is a BBCodeView. I just want it to fill the panel width which is the xlv width.

B4X:

Private Sub AnimatePanelText(xlv As CustomListView, _
                         WaitAfter As Int, _
                         Content As String, _
                         Height As Int, _
                         Color As Int) As ResumableSub

    LogSub("AnimatePanel:  Content = " & Content)
 
    Dim p As B4XView = xui.CreatePanel("")
    p.SetLayoutAnimated(0,0,0, xlv.AsView.Width, Height)
    p.SetColorAnimated(0, xui.Color_Transparent, Color)
 
    '    1. Create a layout with BBCodeView.
    '    2. Initialize a BCTextEngine object. This should be called after the BBCodeViews And BBLabels were added.
    p.LoadLayout("pnlBCEngine")
 
    ''BBCodeView1.mBase.SetLayoutAnimated(0,0,0,320,Height)    '    nope

    Dim sp As ScrollPane = BBCodeView1.sv
    sp.SetVScrollVisibility("NEVER")
    ''sp.SetLayoutAnimated(0,0,0,B4M.xDevWidth,Height)
    sp.SetLayoutAnimated(0,0,0,320,Height)    '    nope
    ''sp.FitToWidth = True        '    nope
 
    TextEngine.Initialize(p)
    BBCodeView1.Text = Content

    ''BBCodeView1.Base_Resize(B4M.xDevWidth, Height)    '    nope

    xlv.Add(p, xlv.Size)    '     unique at least
 
    p = xlv.GetPanel(xlv.Size-1)
    p.Visible = False
    p.SetVisibleAnimated(WaitAfter, True)
 
    If xui.IsB4J Then
        Sleep(0)
    Else
        Sleep(WaitAfter)
    End If
 
    Return True
 
End Sub

I am determined to get to something like this (sry not my ad): Star Wars Crawl

TILogistic · Jul 16, 2022

?

I am determined to get to something like this (sry not my ad): Star Wars Crawl

upload an example.

mmieher · Jul 16, 2022

Ok, Omar. Thank you. It is embarrassing to expose my primitive coding and lack of general knowledge, but here it is. See AnimatePanelText in B4XTimeline.

[moments later] The Export to Zip file is too large? Here is just the one B4XPage. Using B4J right now.

You mean a "small example". (Doh!)

TILogistic · Jul 16, 2022

i want to do something like this, can be a starting point

[B4XPages] Is there a timeline component that someone did?

Ola I'm in need of a timeline component that could be used across platforms.e g. Extended example? Is there something like this that has been done by someone? Thanks

www.b4x.com

TILogistic · Jul 16, 2022

??

I am determined to get to something like this (sry not my ad): Star Wars Crawl

use:

[B4X] [XUI] BitmapCreator - Pixels, Drawings and More

BitmapCreator is a cross platform class. Its core is made of: 1. A bytes array that represents an image. 2. Platform specific code that efficiently creates a regular bitmap from the bytes array data (Bitmap property). 3. Platform specific code that efficiently extracts the pixels data from a...

www.b4x.com

Sine wave a label (D.Y.C.P. scrolling)

How to make a label move in a smooth sine/cosine wave for example up and down or sideways in a transparent label. I would like to play around with this for a credits pane. A simple loop with values to play around with will help along way. Look forward to see some examples from you math gurus out...

www.b4x.com

mmieher · Jul 17, 2022

[GMT -8]

Morning, @Omar Parra A. !
Here is a small B4J project. This must have something to do with the scroll bar?
@mmieher

B4X:

#Region Project Attributes
    #MainFormWidth: 600
    #MainFormHeight: 600
#End Region

Sub Process_Globals
    Private fx As JFX
    Private MainForm As Form
    Private xui As XUI

    Private BBCodeView1 As BBCodeView
    Private TextEngine As BCTextEngine
    Private xlvText As CustomListView

End Sub

Sub AppStart (Form1 As Form, Args() As String)
    MainForm = Form1
    MainForm.RootPane.LoadLayout("Layout1")
    MainForm.Show
   
    '    works perfectly by itself
''    TextEngine.Initialize(MainForm.RootPane)
''    BBCodeView1.Text = "[Alignment=Center][TextSize=24][color=#f9a11b][Vertical=30]I am TEXT.[/Vertical][/color]"
''    Dim sp As ScrollPane = BBCodeView1.sv
''    sp.SetVScrollVisibility("NEVER")

    xlvText.Clear

    For i = 0 To 1
       
        '    strange void at right of p panel -- color is background of Layout1
       
        Dim p As B4XView = xui.CreatePanel("")
        p.SetLayoutAnimated(0,0,0, 320, 100)
        p.LoadLayout("pnlBCEngine")
       
        TextEngine.Initialize(p)
       
        BBCodeView1.Text = "[Alignment=Center][TextSize=24][color=#f9a11b][Vertical=30]I am TEXT.[/Vertical][/color]"
        Dim sp As ScrollPane = BBCodeView1.sv
        sp.SetVScrollVisibility("NEVER")
       
        xlvText.Add(p,i)
       
    Next
   
End Sub

MicroDrie · Jul 17, 2022

In your example program, the width and height of an element are set to a fixed width <- instead of automatic adjustment <-> which means that there are gaps and overlaps, as it were. A rule of thumb is that you usually set a panel you add to automatic width-justification to prevent this. As for the height, usually the last element on a panel is set to autofill the height.

What is the goal?:

sp.SetVScrollVisibility("NEVER")

Apart from the fact that the displayed text length also depends on the screen on which it is displayed, why take the risk of not displaying a piece of text that does not fit on the screen? In other words, there is a specific goal and there are one or more means to achieve that one specific goal. In your example, scrolling is only a means to be able to display the text that is not displayed as yet, the goal you want to achieve with it is not clear to me.

mmieher · Jul 17, 2022

MicroDrie said:
In your example program, the width and height of an element are set to a fixed width <- instead of automatic adjustment <-> which means that there are gaps and overlaps, as it were. A rule of thumb is that you usually set a panel you add to automatic width-justification to prevent this. As for the height, usually the last element on a panel is set to autofill the height.

What is the goal?:

sp.SetVScrollVisibility("NEVER")

Apart from the fact that the displayed text length also depends on the screen on which it is displayed, why take the risk of not displaying a piece of text that does not fit on the screen? In other words, there is a specific goal and there are one or more means to achieve that one specific goal. In your example, scrolling is only a means to be able to display the text that is not displayed as yet, the goal you want to achieve with it is not clear to me.

I started with anchors, scripts, etc. Needed to simplify by just putting 320 for the width everywhere.

My goal is to place a BBCodeView into an XLV item. The BBCodeView should fill the entire width of the XLV. No scrollbar for BBCodeView. Yes scrollbar for XLV.

"Type mismatch" when XLV.Add(BBCodeView1, 0)
I use Designer layout to have "panel" with BBCodeView child.
I load layout, mess with it, then XLV.add(pnl,0).

Result is what you see. Why is BBCodeView not spanning the entire 320 units?

MicroDrie · Jul 17, 2022

As I wrote before the first reason is this:

When changed it is smaller and the second reason is the reservation for space of the scrollbar for access to the overflow text.

My advice is to study the drawer menu how to use a small part of the screen.

mmieher · Jul 17, 2022

MicroDrie said:
As I wrote before the first reason is this:
View attachment 131513
When changed it is smaller and the second reason is the reservation for space of the scrollbar for access to the overflow text.
View attachment 131515
My advice is to study the drawer menu how to use a small part of the screen.

My non-working example does not touch B4XPages or B4XDrawers.

Please upload a working example of BBCodeView spanning entire item panel in xlv. No scrollbar. Use scrollbar space.

MicroDrie · Jul 17, 2022

mmieher said:
Please upload a working example of BBCodeView spanning entire item panel in xlv. No scrollbar. Use scrollbar space.

In this forum we help each other by seeing if and if so how we can advise someone to improve the program code, not to write program examples for others.

mmieher · Jul 18, 2022

This was perplexing, because each XLV panel had its own ScrollBar. Not one big bar for the height of the xlv.

Turned out this was about the ScrollBar in the xCustomListView. Not ScrollBars in the BBCodeViews.
Turning off the xlv scrollbar fixed it. SB was only needed during development in B4j anyway.

Absolutely nothing to do with my Drawers. No B4XPages side-effect either.

Finally, I could just swear that I have seen lots of people post examples of working code in here? Next time I do that, I will Report myself.

[Just read again from beginning. I did a terrible job of stating my issue right at the beginning. Will try not to repeat that.]

B4J Question [SOLVED] BCTextEngine Example (BCTextExample)

mmieher

Active Member

mmieher

TILogistic

Expert

mmieher

Active Member

TILogistic

Expert

[work in progress] BCText - Cross platform text engine

mmieher

Active Member

TILogistic

Expert

mmieher

Active Member

TILogistic

Expert

[B4XPages] Is there a timeline component that someone did?

TILogistic

Expert

[B4X] [XUI] BitmapCreator - Pixels, Drawings and More

Sine wave a label (D.Y.C.P. scrolling)

mmieher

Active Member

Attachments

MicroDrie

Well-Known Member

mmieher

Active Member

MicroDrie

Well-Known Member

mmieher

Active Member

MicroDrie

Well-Known Member

mmieher

Active Member

Similar Threads