How to change WinUI "hovered" style.

[Larry]

I use various styles for the grid. However, for WinUI, when I move my mouse from row to row (not clicking to select a row, just mousing over), the styles I have cause every other row to be a black bar (I use Alternate row styling). How do I change the text color for these 'hovered' rows?

Also, I just noticed that row selection isn't working in the iOS simulator. I'll investigate of course, but are there any known issues I should be aware of in the iOS grid?

[Antoan]

Hi Larry,

Thank you for your interest in Telerik UI for .NET MAUI.

To change the TextColor of a cell on hover, I suggest you use the TextColumn as you can manipulate the CellContentStyle and the TextCellStyle. TextCellStyle contains an API "HoverTextColor", using it looks as follows:

<telerik:DataGridTextColumn PropertyName="Name" 
                                                HeaderText="Name">
                        <telerik:DataGridTextColumn.CellContentStyle>
                            <telerik:DataGridTextCellStyle TextColor="Green" 
                                                           HoverTextColor="Red"
                                                           FontSize="15" 
                                                           SelectedTextColor="Orange"  />   
                        </telerik:DataGridTextColumn.CellContentStyle>
                    </telerik:DataGridTextColumn>

 

The code produces the following result:

For more information about TextColumn please go to the following link leading to our documentation: https://docs.telerik.com/devtools/maui/controls/datagrid/columns/column-types/text-column 

Regarding the row selection in iOS, we are not aware of any issues related to row selection on the platform. If you could take some time to create a project replicating the issue, I can research the case.

Regards,
Antoan
Progress Telerik

[Larry]

Thanks. What I'm seeing is a change in behavior between Xamarin Forms and Maui for the DataGrid. In Xamarin Forms, simply moving the mouse over the grid does nothing. In Maui, moving the mouse causes a different look being applied to the row under the mouse.

This is a sample grid without the mouse hovering (top row, normal styling, middle row, alternate row styling, bottom row, 'selected' style):

This is the same grid with the mouse hovering over the first row:

I am using a DataGridDateColumn, two DataGridTimeColumn, and one DataGridNumericalColumn.

Is there a way to 'turn off' this hovered behavior so it acts like the Xamarin Forms DataGrid? Or is there a template I can modify?

Actually ... I happened to see MouseHoverStyle by chance, and it looks like the answer I was hoping for (so I'm good now, thanks):

                <telerik:RadDataGrid.MouseHoverStyle>
                    <telerik:DataGridBorderStyle BackgroundColor="Gray" />
                </telerik:RadDataGrid.MouseHoverStyle>

However, while I'm here...

How do I change the ListPicker to not show the dropdown button on the right side of the control? This is another change from Xamarin Forms to Maui and I don't see how to change this.

Example from Xamarin Forms:

Same code in Maui:

 

[Yana]

Link to the related post regarding the question with the toggle button: https://www.telerik.com/forums/dropdown-button-in-listpicker