Questions on UI for .NET MAUI Forum

1 answer

1.3K+ views

Margin between the image and button text

Hi,

How I set margin between the image and button text ?

Thanks,

Button

answered on 18 Apr 2022

1 answer

550 views

There is a little difference between TelerikUI popup and MAUI popup when Screen Resolution changed.

MAUI popup

Can adjust the location of popup automatically, when Screen Resolution changed

let's say: the placement target change from normal with size to full-screen

TelerikUI popup

just stay where they are, when Screen Resolution changed

Popup

answered on 18 Apr 2022

1 answer

252 views

FillColor - not complied with dynamic resource

Hi,

Severity	Code	Description	Project	File	Line	Suppression State

Error	XFC0009	No property, BindableProperty, or event found for "FillColor", or mismatching type between value and property.	AutomationClient.MAUI	D:\Applications\AutomationClient\AutomationClient.MAUI\Views\DashboardView.xaml	204

FillColor="{DynamicResource PrimaryColor}"- not complied

<Color x:Key="PrimaryColor">#03446a</Color>

 <telerikChart:RadCartesianChart Grid.Row="5" Grid.Column="0" x:Name="totalFilesDividedByRoutesChart" Margin="10" >
                <telerikChart:RadCartesianChart.Palette>
                    <telerikChart:ChartPalette>
                        <telerikChart:ChartPalette.Entries>
                            <telerikChart:PaletteEntry FillColor="{DynamicResource PrimaryColor}" StrokeColor="{DynamicResource PrimaryColor}" />
                        </telerikChart:ChartPalette.Entries>
                    </telerikChart:ChartPalette>
                </telerikChart:RadCartesianChart.Palette>
                <telerikChart:RadCartesianChart.HorizontalAxis>
                    <telerikChart:CategoricalAxis PlotMode="OnTicks"/>
                </telerikChart:RadCartesianChart.HorizontalAxis>
                <telerikChart:RadCartesianChart.VerticalAxis>
                    <telerikChart:NumericalAxis LabelFitMode="MultiLine" LabelFormat="N0"  Minimum="0" />
                </telerikChart:RadCartesianChart.VerticalAxis>
                <telerikChart:RadCartesianChart.Series>
                    <telerikChart:BarSeries ValueBinding="Value"
                                    CategoryBinding="RouteName"
                                    ItemsSource="{Binding TotalFilesDividedByRoutesDataSource}"/>
                </telerikChart:RadCartesianChart.Series>
                <telerikChart:RadCartesianChart.Grid>
                    <telerikChart:CartesianChartGrid StripLinesVisibility="X"
                                       MajorLinesVisibility="XY"
                                       MajorLineColor="LightGray"
                                       MajorLineThickness="3" />
                </telerikChart:RadCartesianChart.Grid>
                <telerikChart:RadCartesianChart.ChartBehaviors>
                    <telerikChart:ChartTooltipBehavior />
                </telerikChart:RadCartesianChart.ChartBehaviors>
            </telerikChart:RadCartesianChart >

Chart

answered on 14 Apr 2022

1 answer

91 views

custom dropDowViewFooterTemplate

Hi,

I want to achieve this UI using path.

Thanks,

 <ControlTemplate x:Key="dropDowViewFooterTemplate">
                <telerikMauiControls:RadBorder BackgroundColor="{TemplateBinding BackgroundColor}"
                                               BorderColor="{TemplateBinding BorderColor}"
                                               BorderThickness="{TemplateBinding BorderThickness}"
                                               CornerRadius="{TemplateBinding CornerRadius}">
                    <Grid ColumnSpacing="0"
                          RowSpacing="0">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*" />
                            <ColumnDefinition Width="auto" />
                            <ColumnDefinition Width="*" />
                        </Grid.ColumnDefinitions>
                        <telerikMauiControls:RadButton Grid.Column="0" HorizontalOptions="Center" VerticalOptions="Center"
                                               Text="{TemplateBinding CancelButtonText}"
                                               Style="{TemplateBinding CancelButtonStyle}"
                                               Command="{TemplateBinding CancelCommand}"/>
                        <telerikMauiControls:RadButton Grid.Column="2" HorizontalOptions="Center" VerticalOptions="Center"
                                               Text="{TemplateBinding AcceptButtonText}"
                                               Style="{TemplateBinding AcceptButtonStyle}"
                                               Command="{TemplateBinding AcceptCommand}"/>
                    </Grid>
                </telerikMauiControls:RadBorder>
            </ControlTemplate>

Path

answered on 14 Apr 2022

0 answers

97 views

The title of y values in y axis cut

Hi,

See the text below it should be "Test234" and we see "est1234".

How it can be fix ?

Thanks,

        <telerikChart:RadCartesianChart Grid.Row="5" Grid.Column="0" x:Name="totalFilesDividedByRoutesChart" Margin="10">
                <telerikChart:RadCartesianChart.HorizontalAxis>
                    <telerikChart:CategoricalAxis PlotMode="OnTicks"/>
                </telerikChart:RadCartesianChart.HorizontalAxis>
                <telerikChart:RadCartesianChart.VerticalAxis>
                    <telerikChart:NumericalAxis LabelFitMode="MultiLine" LabelFormat="N0"  Minimum="0" />
                </telerikChart:RadCartesianChart.VerticalAxis>
                <telerikChart:RadCartesianChart.Series>
                    <telerikChart:BarSeries ValueBinding="Value"
                                    CategoryBinding="RouteName"
                                    ItemsSource="{Binding TotalFilesDividedByRoutesDataSource}" />
                </telerikChart:RadCartesianChart.Series>
                <telerikChart:RadCartesianChart.Grid>
                    <telerikChart:CartesianChartGrid StripLinesVisibility="X"
                                       MajorLinesVisibility="XY"
                                       MajorLineColor="LightGray"
                                       MajorLineThickness="3" />
                </telerikChart:RadCartesianChart.Grid>
            </telerikChart:RadCartesianChart>

Chart

asked on 14 Apr 2022

2 answers

637 views

TelerikUI for MAUI: any example of using popup.ContentTemplate.LoadFromXaml()

According to this post: .NET MAUI Popup Documentation | Content | Telerik UI for .NET MAUI, I may want to load the content template of popup dynamically, do you have any example for me?

Popup

answered on 14 Apr 2022

1 answer

748 views

Image Button does not work when use click event to update BackgroundImage property

Hey Team,

I did a test on Telerik Image button on windows platform used below code.

<ImageButton Grid.Row="5" Source="restbutton.png" Clicked="ImageButton_Clicked" VerticalOptions="Center" HorizontalOptions="Center" WidthRequest="100" HeightRequest="100" BorderColor="Red" />
<telerik:RadButton Grid.Row="6" BackgroundImage="restbutton.png" VerticalOptions="Center" HorizontalOptions="Center" WidthRequest="100" HeightRequest="100" Clicked="RadButton_Clicked"/>

        private void RadButton_Clicked(object sender, EventArgs e)
	{
		(sender as Telerik.Maui.Controls.RadButton).BackgroundImage = "focusbutton.png";
	}

	private void ImageButton_Clicked(object sender, EventArgs e)
	{
		(sender as ImageButton).Source = "focusbutton.png";
	}

I found MAUI Image button worked well but Telerik button did not work when clicked each button. you can see my zip file.

sdk: 6.0.200

Telerik: 0.6.0

Button

answered on 14 Apr 2022

0 answers

219 views

RadDataGrid - Look

Hi,

Look how it look when there are a lot of records.

  <telerikDataGrid:RadDataGrid Grid.Row="4" Grid.Column="0" x:Name="resultsDataGrid"  SelectedItem="{Binding HistoryReportSelectedItem, Mode=TwoWay}" Margin="20"
                AutoGenerateColumns="False"  SelectionMode="Single" SelectionUnit="Row" ItemsSource="{Binding HistoryReportSource, Mode=TwoWay}" HeightRequest="400" 
                                         AlternateRowBackgroundStyle="{StaticResource AlternateRowBackgroundStyle}">
                      <telerikDataGrid:RadDataGrid.Columns>
                    <telerikDataGrid:DataGridTextColumn PropertyName="Succeded" HeaderText="Results" HeaderStyle="{StaticResource DataGridTextColumnHeaderStyle}" CellDecorationStyle="{StaticResource DataGridTextColumnBorderStyle}"/>
                    <telerikDataGrid:DataGridTextColumn PropertyName="Type" HeaderText="Type" HeaderStyle="{StaticResource DataGridTextColumnHeaderStyle}" CellDecorationStyle="{StaticResource DataGridTextColumnBorderStyle}"/>
                    <telerikDataGrid:DataGridTextColumn PropertyName="EndTime" HeaderText="End Time" HeaderStyle="{StaticResource DataGridTextColumnHeaderStyle}" CellDecorationStyle="{StaticResource DataGridTextColumnBorderStyle}"/>
                    <telerikDataGrid:DataGridTextColumn PropertyName="File" HeaderText="File" HeaderStyle="{StaticResource DataGridTextColumnHeaderStyle}" CellDecorationStyle="{StaticResource DataGridTextColumnBorderStyle}"/>
                    <telerikDataGrid:DataGridTextColumn PropertyName="Route" HeaderText="Route" HeaderStyle="{StaticResource DataGridTextColumnHeaderStyle}" CellDecorationStyle="{StaticResource DataGridTextColumnBorderStyle}"/>
                    <telerikDataGrid:DataGridTextColumn PropertyName="FailedFolder" HeaderText="FailedFolder" HeaderStyle="{StaticResource DataGridTextColumnHeaderStyle}" CellDecorationStyle="{StaticResource DataGridTextColumnBorderStyle}"/>
                    <telerikDataGrid:DataGridTextColumn PropertyName="Portal" HeaderText="Portal" HeaderStyle="{StaticResource DataGridTextColumnHeaderStyle}" CellDecorationStyle="{StaticResource DataGridTextColumnBorderStyle}"/>
                 </telerikDataGrid:RadDataGrid.Columns>
            </telerikDataGrid:RadDataGrid>

DataGrid

asked on 13 Apr 2022

1 answer

160 views

Y axis - as integer

Hi,

I want the y axis to show integer number not double , how is done ?

Thanks,

  <Label Grid.Row="2" Grid.Column="0" Text="Total Files In Progress" HorizontalOptions="Center" VerticalOptions="Center"/>
            <telerikChart:RadCartesianChart Grid.Row="3" Grid.Column="0" PaletteName="LightSelected" Margin="10" >
                <telerikChart:RadCartesianChart.HorizontalAxis>
                    <telerikChart:DateTimeContinuousAxis LabelFitMode="Rotate"
                                           MajorStepUnit="Day"/>
                </telerikChart:RadCartesianChart.HorizontalAxis>
                <telerikChart:RadCartesianChart.VerticalAxis>
                    <telerikChart:NumericalAxis LabelFormat="N"
                                   Minimum="0" />
                </telerikChart:RadCartesianChart.VerticalAxis>
                <telerikChart:RadCartesianChart.Series>
                    <telerikChart:LineSeries 
                               CategoryBinding="Date"
                               ValueBinding="Value"
                               ItemsSource="{Binding TotalFilesInProgressDataSource}" />
                </telerikChart:RadCartesianChart.Series>
                <telerikChart:RadCartesianChart.Grid>
                    <telerikChart:CartesianChartGrid StripLinesVisibility="X"
                                       MajorLinesVisibility="XY"
                                       MajorLineColor="LightGray"
                                       MajorLineThickness="3" />
                </telerikChart:RadCartesianChart.Grid>
            </telerikChart:RadCartesianChart>
             <Label Grid.Row="4" Grid.Column="0" Text="Total Files Divided By Routes" HorizontalOptions="Center" VerticalOptions="Center"/>
            <telerikChart:RadCartesianChart Grid.Row="5" Grid.Column="0" x:Name="totalFilesDividedByRoutesChart" Margin="10">
                <telerikChart:RadCartesianChart.HorizontalAxis>
                    <telerikChart:CategoricalAxis PlotMode="OnTicks"/>
                </telerikChart:RadCartesianChart.HorizontalAxis>
                <telerikChart:RadCartesianChart.VerticalAxis>
                    <telerikChart:NumericalAxis LabelFitMode="MultiLine" />
                </telerikChart:RadCartesianChart.VerticalAxis>
                <telerikChart:RadCartesianChart.Series>
                    <telerikChart:BarSeries ValueBinding="Value"
                                    CategoryBinding="RouteName"
                                    ItemsSource="{Binding TotalFilesDividedByRoutesDataSource}" />
                </telerikChart:RadCartesianChart.Series>
                <telerikChart:RadCartesianChart.Grid>
                    <telerikChart:CartesianChartGrid StripLinesVisibility="X"
                                       MajorLinesVisibility="XY"
                                       MajorLineColor="LightGray"
                                       MajorLineThickness="3" />
                </telerikChart:RadCartesianChart.Grid>
            </telerikChart:RadCartesianChart>