Questions on UI for Xamarin Forum

1 answer

90 views

This page jumps out through a button, await navigation PushAsync(new MyKPIMain()); No matter what I click on the time control, there is no response,. But if I don't jump to public app() {initializecomponent(); mainpage = newmykpimain();
}In the case of direct access, it is normal to click the control.

DateTimePicker

answered on 06 May 2022

1 answer

300 views

Problem trying to hide a column when binding RadDataGrid to a DataTable

I'm binding a RadDataGrid to a DataTable and it works well, except:

I want to hide a few of the columns from the grid without removing them from the DataTable
The BindingContextChanged event fires before the columns are created, so I cannot iterate the columns there and hide the ones I don't want to see
The DataBindingComplete event never fires at all (at least when binding to the DataTable). It also doesn't fire when the table is Grouped, Sorted, or Filtered although the documentation says it will
It also doesn't seem to fire the DataBindingComplete even if the AutoGenerateColumns is set to False (although, as expected, there are no columns displayed at all in this case)

So, basically, I don't see a way to do something after the binding is complete and the columns have been autogenerated.

DataGrid

answered on 05 May 2022

1 answer

152 views

Calendar SelectionChanged not working for UWP

Hello,

I have a problem regarding the Calendar DayView on UWP. The problem does not occur for my app on iOS or Android. To load our appointments asynchronous for specific Dates I use the Event SelectionChanged with the prism:EventToCommandBehavior. Everytime the user changes the current day in the dayview new appointments should by loaded by that command and displayed afterwards. Sadly this only works for iOS and Android. On UWP the command is never executed since the event is not triggered. I am using the Telerik.UI.for.Xamarin Nuget-Package Version 2022.1.11 and Prism.Unity.Forms 8.1.97.

Below you can find test code for the problem. In this example the same appointments are created when changing the current day in the dayview.

View:

<pages:vContentPage
    x:Class="v.App.Views.AboutPage"
    xmlns="http://xamarin.com/schemas/2014/forms"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
    xmlns:pages="clr-namespace:v.App.Styling.Pages;assembly=v.App"
    xmlns:prism="http://prismlibrary.com"
    xmlns:telerikInput="clr-namespace:Telerik.XamarinForms.Input;assembly=Telerik.XamarinForms.Input"
    Title="About"
    prism:ViewModelLocator.AutowireViewModel="True"
    BackgroundColor="{DynamicResource ColorBackgroundPrimary}">
        <telerikInput:RadCalendar x:Name="calendar" 
                              ViewMode="Day"
                              AppointmentsSource="{Binding Appointments}">
        <telerikInput:RadCalendar.DayViewSettings>
            <telerikInput:DayViewSettings 
                DayStartTime="6:00:00"                                     
                DayEndTime="18:00:00"                                      
                TimelineInterval="1:00"                                      
                IsCurrentTimeIndicatorVisible="True"/>
        </telerikInput:RadCalendar.DayViewSettings>
        <telerikInput:RadCalendar.Behaviors>
            <prism:EventToCommandBehavior
                        Command="{Binding DaySelectionChangedCommand}"
                        EventArgsConverter="{StaticResource TelerikValueChangedEventArgsConverter}"
                        EventName="SelectionChanged" />
        </telerikInput:RadCalendar.Behaviors>
    </telerikInput:RadCalendar>
</pages:vContentPage>

Corresponding ViewModel:

using Prism.Commands;
using System;
using System.Collections.Generic;
using System.Collections.ObjectModel;
using System.Drawing;
using System.Linq;
using System.Threading.Tasks;
using Telerik.XamarinForms.Input;
using v.App.Helper.Settings;
using v.App.ViewModels.Base;

namespace v.App.ViewModels
{
    public class AboutPageViewModel : BaseViewModel
    {
        #region Constructor

        public AboutPageViewModel()
        {
        }

        private ObservableCollection<Appointment> _appointments = new ObservableCollection<Appointment>();
        public ObservableCollection<Appointment> Appointments
        {
            get { return _appointments; }
            set { _appointments = value; }
        }

        private DelegateCommand<object> _daySelectionChangedCommand;
        public DelegateCommand<object> DaySelectionChangedCommand
        {
            get { return _daySelectionChangedCommand ?? (_daySelectionChangedCommand = new DelegateCommand<object>(async (parameter) => await LoadAppointments(parameter))); }
        }

        private async Task LoadAppointments(object parameter)
        {
            if (parameter == null)
                return;

            await Task.Delay(1);
            var today = DateTime.Today;

            Appointments.Add(new Appointment
            {
                Title = "Meeting with Tom",
                Detail = "Sea Garden",
                StartDate = today.AddHours(7),
                EndDate = today.AddHours(4),
                Color = Color.Tomato
            });

            Appointments.Add(new Appointment
            {
                Title = "Lunch with Sara",
                Detail = "Restaurant",
                StartDate = today.AddHours(12).AddMinutes(30),
                EndDate = today.AddHours(14),
                Color = Color.DarkTurquoise
            });

            Appointments.Add(new Appointment
            {
                Title = "Elle Birthday",
                StartDate = today,
                EndDate = today.AddHours(11),
                Color = Color.Orange,
                IsAllDay = true
            });

            Appointments.Add(new Appointment
            {
                Title = "Football Game",
                StartDate = today.AddDays(2).AddHours(15),
                EndDate = today.AddDays(2).AddHours(17),
                Color = Color.Green
            });          
        }
        #endregion Constructor

        #region Properties
        public override bool ShowOnlineOfflineTemplate { get => false;}

        #endregion Properties
    }
}

Thank you in advance.

Calendar & Scheduling

answered on 04 May 2022

0 answers

147 views

Set MaxRemainingItems with Command for ListView

Hello,

I have an issue regarding the Load on Demand behavior of the Telerik ListView for Xamarin. First i will explain how i defined my ListView and how it should work. The ListView was defined as follows:

            <telerikDataControls:RadListView
                ItemsSource="{Binding MyTickets}"
                SelectedItem="{Binding SelectedTicket, Mode=TwoWay}"
                SelectionMode="Single"
                HeaderTemplate="{StaticResource HeaderTemplate}" 
                FooterTemplate="{StaticResource FooterTemplate}"
                Grid.Row="3"
                IsLoadOnDemandEnabled="True"
                LoadOnDemandMode="Automatic">
                <telerikDataControls:RadListView.Behaviors>
                    <prism:EventToCommandBehavior
                        Command="{Binding ItemTappedCommand}"
                        EventName="ItemTapped" />
                    </telerikDataControls:RadListView.Behaviors>
                <telerikDataControls:RadListView.Commands>
                    <telerikListViewCommands:ListViewUserCommand 
                        Id="LoadOnDemand"                         
                        Command="{Binding LoadItemsCommand}" />
                </telerikDataControls:RadListView.Commands>
                <telerikDataControls:RadListView.ItemTemplate>
                                        ...
                 </telerikDataControls:RadListView.ItemTemplate>
             </telerikDataControls:RadListView>

I have left out the ItemTemplate since it is not relevant for the problem.

As you can see we use the LoadOnDemandMode Automatic for this ListView to load the Data. When the LoadOnDemand event is triggered we load the data with the LoadItemsCommand. The LoadItemsCommand loads 10 elements at a time which functions as lazy loading. The Telerik ListView default value for the MaxRemainingItems is 10. The problem now is that the LoadItemsCommand is triggered twice when opening the page since only 10 elements are loaded each time. We would like to only load 10 elements each time and if the user scrolls down we want to load the next 10 elements.

To solve this problem we tried creating a custom renderer for the ListView and change the value of MaxRemainingItems. We were able to change the value of MaxRemainingItems in the custom renderer but after doing so our LoadItemsCommand was never triggered when the user was scrolling through the ListView. The custom renderer and Listview were tested for Android. I hope you can help us resolve this issue.

We are using Telerik.UI.for.Xamarin Nuget-Package Version 2022.1.1.

Thank you in advance.

ListView

ListView - Xamarin.Android

ListView - Xamarin.iOS

asked on 02 May 2022

1 answer

82 views

I want to put the pop-up box in the lower third

<telerikPrimitives:RadPopup.Popup>
<telerikPrimitives:RadPopup x:Name="popuptwo" IsModal="True" Placement="Center">
<telerikPrimitives:RadBorder WidthRequest="250" HorizontalOptions="Center" VerticalOptions="Center" CornerRadius="8" BackgroundColor="White">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="42"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="50*"></ColumnDefinition>
<ColumnDefinition Width="50*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Grid Grid.Row="0" Grid.ColumnSpan="2">
<telerikInput:RadButton ContentLayout="Left,4" x:Name="images" HorizontalOptions="Start"
BorderColor="#c9c9c9" BackgroundColor="#4295F4" TextColor="White" BorderWidth="1" CornerRadius="8" WidthRequest="400" VerticalOptions="Center"/>
</Grid>
</Grid>
</telerikPrimitives:RadBorder>
</telerikPrimitives:RadPopup>
</telerikPrimitives:RadPopup.Popup>

Popup

answered on 29 Apr 2022

1 answer

51 views

Calendar Localization key

hello，

I want to change the display field to Chinese. How can I get the key of the display field of calendar? Now I can only get calendar_ AllDayAreaText

Calendar - Xamarin.Android

Localization

answered on 29 Apr 2022

0 answers

76 views

RadDateTimePicker What I want to ask is that I can choose the time on my computer, but I can't choose the time on other computers

</Grid>

--样式

--英文改为中文

public class CustomDateTimePickerLocalizationManager: TelerikLocalizationManager
{
public override string GetString(string key)
{

if (key == "DateTimePicker_Popup_HeaderLabelText")
return "Datum und Uhrzeit Picker";
if (key == "DateTimePicker_PlaceholderLabelText")
return "Datum und Uhrzeit auswählen";
if (key == "Picker_AmPmSpinnerHeaderLabelText")
return "am/pm";
if (key == "Picker_DaySpinnerHeaderLabelText")
return "日";
if (key == "Picker_HourSpinnerHeaderLabelText")
return "小时";
if (key == "Picker_MinuteSpinnerHeaderLabelText")
return "分";
if (key == "Picker_SecondSpinnerHeaderLabelText")
return "秒";
if (key == "Picker_MonthSpinnerHeaderLabelText")
return "月";
if (key == "Picker_YearSpinnerHeaderLabelText")
return "年";
if (key == "Picker_Popup_AcceptButtonText")
return "选择";
if (key == "Picker_Popup_CancelButtonText")
return "关闭";

return base.GetString(key);
}
}

--后端

InitializeComponent();
TelerikLocalizationManager.Manager = new CustomDateTimePickerLocalizationManager();
StarDateTime.MinimumDate = DateTime.Now.AddYears(-10);
EndDateTime.MinimumDate = DateTime.Now.AddYears(-10);
StarDateTime.Date = DateTime.Now.AddYears(-1);
EndDateTime.Date = DateTime.Now;

DateTimePicker

TimePicker

asked on 29 Apr 2022

0 answers

97 views

telerikInput:RadButton The button background is a small picture. If you want to move the picture to the right a little,

<telerikPrimitives:RadPopup.Popup>
<telerikPrimitives:RadPopup x:Name="popuptwo" IsModal="True" Placement="Center">
<telerikPrimitives:RadBorder WidthRequest="250" Margin="0,0,0,20" HeightRequest="42" HorizontalOptions="Center" VerticalOptions="Center" CornerRadius="8" BackgroundColor="White">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="42"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="50*"></ColumnDefinition>
<ColumnDefinition Width="50*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Grid Grid.Row="0" Grid.ColumnSpan="2">
<telerikInput:RadButton ContentLayout="Left,4" x:Name="images" HorizontalOptions="Start"
BorderColor="#c9c9c9" BackgroundColor="#4295F4" TextColor="White" BorderWidth="1" CornerRadius="8" WidthRequest="400" VerticalOptions="Center"/>
</Grid>
</Grid>
</telerikPrimitives:RadBorder>
</telerikPrimitives:RadPopup>
</telerikPrimitives:RadPopup.Popup>

popuptwo.IsOpen = true;
images.ImageSource = success;
images.Text = "成功";
Device.StartTimer(TimeSpan.FromMilliseconds(2000),
() =>
{
popuptwo.IsOpen = false;
return false;
});