How to change font size in WebListBox?

SDKs Web SDK
1

How do I change the font size for a WebListBox control? I tried changing the Style property (Style.FontSize) but got an error saying ‘This method is protected…’.

2

Try in the opening event:

Var MyStyle As New WebStyle 

MyStyle.FontSize = 40
Me.Style = MyStyle

Captura de Pantalla 2022-02-13 a la(s) 13.58.06

3

For your sample:


' ORDER BY -unsort-
ListBox1.ColumnSortTypeAt(0) = WebListBox.SortTypes.Unsortable
ListBox1.ColumnSortTypeAt(1) = WebListBox.SortTypes.Unsortable
ListBox1.ColumnSortTypeAt(2) = WebListBox.SortTypes.Unsortable
' Add column names
ListBox1.HeaderAt(0) = "COL1"
ListBox1.HeaderAt(1) = "COL2"
ListBox1.HeaderAt(2) = "COL3"


ListBox1.AddRow("Col1_Row1", "Col2_Row1", "Col3_Row1")
ListBox1.AddRow("Col1_Row2", "Col2_Row2", "Col3_Row2")
ListBox1.AddRow("Col1_Row3", "Col2_Row3", "Col3_Row3")
ListBox1.AddRow("Col1_Row4", "Col2_Row4", "Col3_Row4")
ListBox1.AddRow("Col1_Row5", "Col2_Row5", "Col3_Row5")
4

Notes:

ListBox1 is a child from MyListBox class.

5

How do I create the ‘MyListBox’ item at the same level as ‘WebPage1’?

6

I understand that ListBox1 is a child of MyListBox. But you say to add code to the Opening event for MyListBox. I don’t have anything at the same level as the page like MyListBox. How do I make that happen? I’ll try to share a screenshot of what my app’s hierarchy looks like.

image
image498×1098 105 KB

7

Add a new class to your project. Be careful to define this class as webListBox.

Inside this newly created class, you write the code.

8

Apparently I am doing something wrong because the font size doesn’t change. Here’s what I did …

  1. Created new Web project.
  2. Added new class to project, named LbClass1. Set Super to WebListBox.
  3. Created Opening event handler for LbClass1 and wrote 3 lines of code: Var MyStyle As New WebStyle || MyStyle.FontSize = 14 || Me.Style = MyStyle
  4. Added ListBox1 control to page and set Super to LbClass1.
  5. Added Button1 control to page to add rows to ListBox1.

Saved the project and ran it.

Changed the FontSize to 40. Saved and ran it again. No visible change in font size. See following screenshot.

image
image2680×820 219 KB

What am I doing wrong?

9

Do you want to change the font size for all the web listboxes in your project? If so you could try adding some CSS to the HTML Header of the App Object, for example this makes all the web listboxes display a font size of 40 pixels

<style>

body {
  background: #F6F6F6 ;
}

.table th {
    background-color: #FFFFFF;
}

.table td{
	font-size: 40px;
}
</style>
3 Likes