Telerik Forums
UI for Xamarin Forum
1 answer
411 views

Hi we want to create dynamic tab page using telerik radtabview in our app but unfortunately we could not find any option in telerik for dynamic tab page. So now we are using xamarin forms tabbed page but its complicated. It would be great if there is any solution for that problem by using radtabview. I am sharing my code below:

<TabbedPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:ffimageloading="clr-namespace:FFImageLoading.Forms;assembly=FFImageLoading.Forms"
             xmlns:telerikDataControls="clr-namespace:Telerik.XamarinForms.DataControls;assembly=Telerik.XamarinForms.DataControls"
             xmlns:telerikListView="clr-namespace:Telerik.XamarinForms.DataControls.ListView;assembly=Telerik.XamarinForms.DataControls"
             xmlns:telerikPrimitives="clr-namespace:Telerik.XamarinForms.Primitives;assembly=Telerik.XamarinForms.Primitives"
             x:Class="Ls.Learn.LearnPage"
             ItemsSource="{Binding VolumeCategoryList}"
             x:Name="lTabbedPage"
             BarTextColor="White"
             BarBackgroundColor="#006b91">
<TabbedPage.ItemTemplate>
        <DataTemplate>
            <ContentPage Title="{Binding Label}">
                <telerikDataControls:RadListView  ItemsSource="{Binding Volumes}" x:Name="listView" ItemTapped="Results_ItemTapped">
                    <telerikDataControls:RadListView.ItemTemplate>
                        <DataTemplate>
                            <telerikListView:ListViewTemplateCell>
                                <telerikListView:ListViewTemplateCell.View>
                                    <Grid Padding="12">
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition Width="3*"></ColumnDefinition>
                                            <ColumnDefinition Width="7*"></ColumnDefinition>
                                        </Grid.ColumnDefinitions>
                                        <ffimageloading:CachedImage Grid.Row="0" Grid.Column="0" Aspect="AspectFill"
                                      DownsampleToViewSize="true" Source="{Binding ImageUrl}">
                                        </ffimageloading:CachedImage>
                                        <StackLayout Grid.Column="1" VerticalOptions="StartAndExpand">
                                            <Label class="volume-name"  Text="{Binding VolumeSubject}" LineBreakMode="WordWrap"></Label>
                                        </StackLayout>
                                    </Grid>
                                </telerikListView:ListViewTemplateCell.View>
                            </telerikListView:ListViewTemplateCell>
                        </DataTemplate>
                    </telerikDataControls:RadListView.ItemTemplate>
                    <telerikDataControls:RadListView.LayoutDefinition>
                        <telerikListView:ListViewLinearLayout  />
                    </telerikDataControls:RadListView.LayoutDefinition>
                </telerikDataControls:RadListView>
            </ContentPage>
        </DataTemplate>
    </TabbedPage.ItemTemplate>
</TabbedPage>

Lance | Senior Manager Technical Support
Telerik team
 answered on 08 Jan 2019
1 answer
107 views

I have a nicely working ItemTemplateSelector

 

<telerikDataControls:RadListView.ItemTemplateSelector>
 
  <vm:HotlistItemSelector>
 
     <vm:HotlistItemSelector.ErrorTemplate>
 
          <DataTemplate>
 
               My template here

I wish to reuse my ErrorTemplate. I have placed it in a ResourceDictionary. How can I tell my  HotlistItemSelector that the ErrorTemplate is to be found in the ResourceDictionary ?

 

 

Lance | Senior Manager Technical Support
Telerik team
 answered on 08 Jan 2019
4 answers
262 views

I have a RadListView which uses a ListViewTemplateCell to specify the list item layout.
When the list is displayed initially, the layout looks OK. After using pull to refresh a few times, the layout looks weird. With the example I'm attaching below, the layout is affected typically on the fourth pull to refresh. Just watch the rightmost text how it shifts to the left and right as you pull to refresh. Keep pulling for even more movement.

Telerik_UI_for_Xamarin_2018_2_516_2_Dev
Shared code project targets .NET Standard 1.4
Xamarin Forms 2.5.1.527436
Android
Android 8.1 (API Level 27 - Oreo) - on emulator

Here's the page:
<?xml version="1.0" encoding="utf-8" ?>
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:local="clr-namespace:ListBug"
             xmlns:telerikDataControls="clr-namespace:Telerik.XamarinForms.DataControls;assembly=Telerik.XamarinForms.DataControls"
             xmlns:telerikListView="clr-namespace:Telerik.XamarinForms.DataControls.ListView;assembly=Telerik.XamarinForms.DataControls"
             x:Class="ListBug.MainPage"
             x:Name="Self">
 
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*" />
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>
 
        <telerikDataControls:RadListView x:Name="listView"
                        ItemsSource="{Binding Path=Items, Source={x:Reference Name='Self'}}"
                        IsPullToRefreshEnabled="True"
                        RefreshRequested="listView_RefreshRequested">
            <telerikDataControls:RadListView.ItemTemplate>
                        <DataTemplate>
                            <telerikListView:ListViewTemplateCell>
                                <telerikListView:ListViewTemplateCell.View>
                                    <Grid RowSpacing="2" Padding="5, 0, 5, 0">
                                        <Grid.ColumnDefinitions>
                                            <ColumnDefinition Width="4*"/>
                                            <ColumnDefinition Width="1*"/>
                                        </Grid.ColumnDefinitions>
                                        <Grid.RowDefinitions>
                                            <RowDefinition Height="Auto" />
                                            <RowDefinition Height="Auto" />
                                        </Grid.RowDefinitions>
                                        <Label Text="{Binding Overview}" />
                                        <Label Grid.Row="1" Text="{Binding Details}" />
                                        <Label Grid.Column="1" Grid.RowSpan="2" Text="{Binding Other}" HorizontalTextAlignment="End" VerticalTextAlignment="Center" />
                                    </Grid>
                                </telerikListView:ListViewTemplateCell.View>
                            </telerikListView:ListViewTemplateCell>
                        </DataTemplate>
            </telerikDataControls:RadListView.ItemTemplate>
        </telerikDataControls:RadListView>
 
    </Grid>
</ContentPage>

 

Here's the code behind:

using System.Collections.Generic;
using Xamarin.Forms;
 
namespace ListBug
{
    public partial class MainPage : ContentPage
    {
 
        public static readonly BindableProperty ItemsProperty =
            BindableProperty.Create(nameof(Items), typeof(List<Item>), typeof(MainPage), default(List<Item>), BindingMode.Default, null);
 
        public List<Item> Items
        {
            get { return (List<Item>)GetValue(ItemsProperty); }
            set { SetValue(ItemsProperty, value); }
        }
 
        public MainPage()
        {
            InitializeComponent();
            InitializeItems();
        }
 
        private void InitializeItems()
        {
            Items?.Clear();
            var items = new List<Item>();
 
            items.Add(new Item()
            {
                Overview = "First item overview",
                Details = "First item details",
                Other = "Item1"
            });
            items.Add(new Item()
            {
                Overview = "Second item overview",
                Details = "Second item details",
                Other = "Item2"
            });
            items.Add(new Item()
            {
                Overview = "Third item overview",
                Details = "Third item details",
                Other = "Item3"
            });
            items.Add(new Item()
            {
                Overview = "Fourth item overview",
                Details = "Fourth item details",
                Other = "Item4"
            });
            items.Add(new Item()
            {
                Overview = "Fifth item overview",
                Details = "Fifth item details",
                Other = "Item5"
            });
 
            Items = items;
        }
 
        private void listView_RefreshRequested(object sender, Telerik.XamarinForms.DataControls.ListView.PullToRefreshRequestedEventArgs e)
        {
            InitializeItems();
            listView.EndRefresh(true);
        }
    }
}

 

and here's the Item class

namespace ListBug
{
    public class Item
    {
        public string Overview { get; set; }
        public string Details { get; set; }
        public string Other { get; set; }
    }
}

Lance | Senior Manager Technical Support
Telerik team
 answered on 08 Jan 2019
4 answers
247 views
Is there a way to access or set the selected item or tokens in an MVVM setup? We would love to use this a mobile combobox, but cant see to find ways to set or access the selected collection. thanks.
Olivier
Top achievements
Rank 1
 answered on 08 Jan 2019
5 answers
150 views

Hi guys,

How to :

1) Focus control ? By focus I mean that keyboard should pop up, and now after calling Focus nothing happens.

2) Change styling of text box ?

3) Dynamicaly load suggested items on the fly?

4) Change the message of "no items found" ?

 

Best Regards

Didi
Telerik team
 answered on 08 Jan 2019
1 answer
165 views

I see in Xamarin.Forms there is a StickyHeaderBehaviour. How do I enable this in Xamarin Forms for iOS and Android? I did not see it under the Behaviours collection.

 

XAML please.

 

I want the header to stick as you scroll until the next header appears. Standard behaviour.

 

Ian

 

Yana
Telerik team
 answered on 08 Jan 2019
1 answer
139 views

Hello!

I am trying  to change default timeline in multiday calender mode with text value such as name .I have implemented telerik ui calender on my android device . 

Attached 2 images i.e. Img Telerik A.png (Implemented on Device)  and Img Telerik B.png (Required).

I want marked timeline in as 1 in Img Telerik A.png to change into marked text  as 2 in Img Telerik B.png.

Code Snippet for calender as follows:

TelerikCalender.xaml

<telerikInput:RadCalendar x:Name="calendar" AppointmentsSource="{Binding Appointments}" AppointmentTapped="Calendar_AppointmentTapped"  NativeControlLoaded="Calendar_NativeControlLoaded">
            <telerikInput:RadCalendar.MultiDayViewSettings>
                <telerikInput:MultiDayViewSettings VisibleDays="7"
                DayStartTime="9:00:00"
                DayEndTime="18:00:00"
                TimelineInterval="1:00"
                IsWeekendVisible="True"                 
                IsCurrentTimeIndicatorVisible="False" />
            </telerikInput:RadCalendar.MultiDayViewSettings>
            <telerikInput:RadCalendar.MultiDayViewStyle>
                <telerikInput:MultiDayViewStyle
                AllDayAreaBackgroundColor="Beige"
                AllDayAppointmentBackgroundColor="CornflowerBlue"
                AllDayAppointmentTextColor="White"
                CurrentTimeIndicatorColor="Blue"
                AppointmentFontSize="11"
                AllDayAppointmentFontSize="11" />
            </telerikInput:RadCalendar.MultiDayViewStyle>
        </telerikInput:RadCalendar>

TelerikCalender.xaml.cs

 private void Calendar_NativeControlLoaded(object sender, EventArgs e)
        {
            (sender as RadCalendar).TrySetViewMode(CalendarViewMode.MultiDay);            
        }

Please let me know if its possible and if yes how to implement the same.

Thanks in Advance.

Yana
Telerik team
 answered on 07 Jan 2019
7 answers
454 views

I need to add a side drawer to an app that has a Xamarin Forms TabbedPage as it's main page - I am aiming for the same navigation as e.g. the Twitter app on Android.

However the MainContent property of the RadSideDrawer is of type View instead of Page so I cannot set it to a TabbedPage instance.

-> Is it possible to use a TabbedPage with RadSideDrawer? If yes, how?

If this is not possible, would the standard Xamarin Forms MasterDetailPage, offer an alternative?
It has Master and Detail properties of type Page and it is used to create a side drawer in e.g. the Hanselman.Forms app (although not on a TabbedPage).

Nethra
Top achievements
Rank 1
 answered on 03 Jan 2019
1 answer
139 views

Hello Team,

I am getting Issue while Add Token Programmatically.

I am using RadAutoCompleteTextView for Adding Token Programmatically.

radAutoCompleteTextView.AddToken();

But in This AddToken Method, I have to pass parameter TokenView.  But I don't know how to pass it.

I just want to add one string, like Person Name Programmatically in Token.

I spent many hours but not getting success,
So, if anyone can help me on this, it will be appreciated.

Thanks,

Lance | Senior Manager Technical Support
Telerik team
 answered on 03 Jan 2019
2 answers
125 views
Hello Team,

I am getting Issue while Remove Token Programmatically.

Steps i Follow:

1) I am Adding my Token Programmatically, which is successfully Add in the AutoCompleteTextView,
I am adding Token using Below Method.
=> this.Autocomplete.AddToken(new TKAutoCompleteToken(new NSString("DummyToken")));

2) Now when i try to remove the same Token Programmatically, I ma using Below Code,
=> this.Autocomplete.RemoveToken(new TKAutoCompleteToken(new NSString(DummyToken)));

But it is not removing from AutoCompleteTextView.

I spent many hours but not getting success,

So, if anyone can help me on this, it will be appreciated.

Thanks,

Mayank
Top achievements
Rank 1
 answered on 03 Jan 2019
Top users last month
Rob
Top achievements
Rank 3
Iron
Iron
Iron
Atul
Top achievements
Rank 1
Iron
Iron
Iron
Alexander
Top achievements
Rank 1
Veteran
Iron
Serkan
Top achievements
Rank 1
Iron
Shawn
Top achievements
Rank 1
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?