[UWP][C#] Font size in UI controls - datagrid and listbox

Question

question

PaulaMorgan-3461 asked · Dec 03, 2019 at 01:08 PM

[UWP][C#] Font size in UI controls - datagrid and listbox

How can I change the font size of the header column of the datagrid? Microsoft.Toolkit.Uwp.UI.Controls.DataGrid

I also find that I cannot change the font size of the contents of a listbox either. I need to do both in code...not xaml.

Thanks, Paula

uwp

10 |1000 characters needed characters left characters exceeded

Attachments: Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

Answer 1 · 2019-12-03T14:38:04.103Z

NicoZhu-MSFT answered · Dec 03, 2019 at 02:38 PM

How can I change the font size of the header column of the datagrid?

The header of DataGrid is DataGridColumnHeader that under Microsoft.Toolkit.Uwp.UI.Controls.Primitives name space. you could edit the default style like the following:

alt text

Edit in code behind

For example, if i want to modify the first column header's fontsize.

 var colum = MyDataGrid.Columns[0] as DataGridBoundColumn;
 var headerstyle = new Style(typeof(DataGridColumnHeader));
 headerstyle.Setters.Add(new Setter(DataGridColumnHeader.FontSizeProperty, 12));  
 colum.HeaderStyle = headerstyle;

I also find that I cannot change the font size of the contents of a listbox either.

For ListBox content, we suggest you use binding that bind the FontSize with a value that comes from your data model or code behind.

For code behind

 public int MyFontSize { get; set; }
 
 public MainPage()
 {
     this.InitializeComponent();
     this.DataContext = this;
     MyFontSize = 25;
 }

Xaml (and RootPage is page name)

alt text

批注-2019-12-03-221501.jpg (27.5 KiB)

批注-2019-12-03-223901.jpg (22.5 KiB)

· 1 · Share

10 |1000 characters needed characters left characters exceeded

Attachments: Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

PaulaMorgan-3461 · Dec 05, 2019 at 02:27 PM

Thank you very much for the information! I got the data grid font working.

I'm still having an issue with the listbox though. I create it completely in c# - no xaml, so I'm not sure how to apply your suggestion above. I tried to create the data template in code and then set it to the listbox's datatemplate property but it's still not working.

Sorry, if I'm missing something simple and thanks again for the help.

0 · ·

Answer 2 · 2019-12-05T23:17:06.517Z

PaulaMorgan-3461 answered · Dec 05, 2019 at 11:17 PM

I was able to solve my problem by creating the xaml in code and setting it to the listbox's itemtemplate:

alt text

Then for the listbox:

 DataTemplate datatemplate = (DataTemplate)XamlReader.Load(GetDataTemplate().ToString());
 
             ItemTemplate = datatemplate;

code.png (19.0 KiB)

· Share

10 |1000 characters needed characters left characters exceeded

Attachments: Up to 10 attachments (including images) can be used with a maximum of 3.0 MiB each and 30.0 MiB total.

question