Tab doesn't show contents

4 posts, 1 answers
  1. Mikhail
    Mikhail avatar
    12 posts
    Member since:
    Jul 2017

    Posted 17 Jul Link to this post

    I have a Telerik TabView which has Telerik ListView in one of the tabs.

    The first time page with tabs is opened the list view does not show or shows truncated as in the picture below (tab1.png).

    When I navigate to another tab and go back to first tab the content is then shown, as seen in the second picture (tab2.png).

    <ContentPage.Content>
                <telerikPrimitives:RadTabView x:Name="TabView">
                    <telerikPrimitives:RadTabView.Items>
                        <telerikPrimitives:TabViewItem HeaderText="Home">
                            <telerikPrimitives:TabViewItem.Content>
     
                                <telerikDataControls:RadListView x:Name="PeopleListView"
                                                                 ItemsSource="{Binding}"
                                                                 IsItemSwipeEnabled="True"
                                                                 SwipeOffset="150, 0, 0, 0"
                                                                 SwipeThreshold="10">
                                <!-- ... -->
                                </telerikDataControls:RadListView>
                                 
                            </telerikPrimitives:TabViewItem.Content>
                        </telerikPrimitives:TabViewItem>
                        <telerikPrimitives:TabViewItem HeaderText="Folder">
                            <telerikPrimitives:TabViewItem.Content>
                                <Label Margin="10" Text="This is the content of the Folder tab" />
                            </telerikPrimitives:TabViewItem.Content>
                        </telerikPrimitives:TabViewItem>
                        <telerikPrimitives:TabViewItem HeaderText="View">
                            <telerikPrimitives:TabViewItem.Content>
                                <Label Margin="10" Text="This is the content of the View tab" />
                            </telerikPrimitives:TabViewItem.Content>
                        </telerikPrimitives:TabViewItem>
                    </telerikPrimitives:RadTabView.Items>
                </telerikPrimitives:RadTabView>
     
        </ContentPage.Content>
  2. Answer
    Stefan Nenchev
    Admin
    Stefan Nenchev avatar
    503 posts

    Posted 18 Jul Link to this post

    Hello Mikhail,

    I tried to replicate the behavior you are reporting but was not able to. Can you provide the ListView ItemTemplate that you have set at your end? Is the behavior present each time you run the application or it appears on a random basis?  I have attached the sample for your reference. If convenient, please try modifying it so that the issue is present so we can have a more detailed look.

    Have a great rest of the week.

    Regards,
    Stefan Nenchev
    Progress Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
  3. Mikhail
    Mikhail avatar
    12 posts
    Member since:
    Jul 2017

    Posted 18 Jul Link to this post

    Hi Stefan,

    thank you for the reply. I modified your project and was not able to replicate the problem. I will have to look into my project. My content page was as follows

     

    <?xml version="1.0" encoding="utf-8" ?>
                 xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
                 xmlns:telerikPrimitives="clr-namespace:Telerik.XamarinForms.Primitives;assembly=Telerik.XamarinForms.Primitives"
                 xmlns:telerikDataControls="clr-namespace:Telerik.XamarinForms.DataControls;assembly=Telerik.XamarinForms.DataControls"
                 xmlns:telerikChart="clr-namespace:Telerik.XamarinForms.Chart;assembly=Telerik.XamarinForms.Chart"
                 xmlns:telerikInput="clr-namespace:Telerik.XamarinForms.Input;assembly=Telerik.XamarinForms.Input"
                 xmlns:telerikGauges="clr-namespace:Telerik.XamarinForms.DataVisualization.Gauges;assembly=Telerik.XamarinForms.DataVisualization"
                 xmlns:telerikListView="clr-namespace:Telerik.XamarinForms.DataControls.ListView;assembly=Telerik.XamarinForms.DataControls"
                 xmlns:abstractions="clr-namespace:ImageCircle.Forms.Plugin.Abstractions;assembly=ImageCircle.Forms.Plugin.Abstractions"
                 x:Class="TelerikXamarin.Portable.StartPage">
        <ContentPage.Resources>
            <ResourceDictionary>
                 
            </ResourceDictionary>
        </ContentPage.Resources>
        <ContentPage.Content>
            <telerikPrimitives:RadTabView x:Name="TabView">
                <telerikPrimitives:RadTabView.Items>
                    <telerikPrimitives:TabViewItem HeaderText="Home">
                        <telerikPrimitives:TabViewItem.Content>
     
                            <telerikDataControls:RadListView x:Name="PeopleListView"
                                                                 ItemsSource="{Binding}"
                                                                 IsItemSwipeEnabled="True"
                                                                 SwipeOffset="150, 0, 0, 0"
                                                                 SwipeThreshold="10">
                                <telerikDataControls:RadListView.ItemTemplate>
                                    <DataTemplate>
                                        <telerikListView:ListViewTemplateCell>
                                            <telerikListView:ListViewTemplateCell.View>
     
     
                                                <Grid Margin="5">
                                                    <Grid.ColumnDefinitions>
                                                        <ColumnDefinition Width="Auto"></ColumnDefinition>
                                                        <ColumnDefinition Width="*"></ColumnDefinition>
                                                        <ColumnDefinition Width="Auto"></ColumnDefinition>
                                                    </Grid.ColumnDefinitions>
                                                    <Grid.RowDefinitions>
                                                        <RowDefinition Height="Auto"></RowDefinition>
                                                        <RowDefinition></RowDefinition>
                                                    </Grid.RowDefinitions>
                                                    <abstractions:CircleImage
                                                    WidthRequest="70"
                                                    HeightRequest="70"
                                                    Source="{Binding ProfilePictureUrl}"
                                                    Aspect="AspectFit"
                                                    Grid.RowSpan="2"
                                                    Grid.Column="0"
                                                    Margin="5">
                                                    </abstractions:CircleImage>
                                                    <Label Grid.Column="1" Grid.Row="0"
                                                       FontSize="Medium" Text="{Binding Name}"></Label>
                                                    <Label Grid.Column="1" Grid.Row="1"
                                                       VerticalTextAlignment="Start" VerticalOptions="Start"
                                                       Text="{Binding Description}"></Label>
                                                    <Image Grid.RowSpan="2" Grid.Column="2"
                                                       VerticalOptions="Center" Source="ic_people_outline" WidthRequest="50"
                                                       HeightRequest="50" Opacity="0.35"></Image>
                                                </Grid>
     
     
                                            </telerikListView:ListViewTemplateCell.View>
                                        </telerikListView:ListViewTemplateCell>
                                    </DataTemplate>
                                </telerikDataControls:RadListView.ItemTemplate>
     
                                <telerikDataControls:RadListView.ItemSwipeContentTemplate>
                                    <DataTemplate>
                                        <Grid Margin="0"
                                          Padding="0"
                                          ColumnSpacing="0"
                                          RowSpacing="0">
                                            <Grid.ColumnDefinitions>
                                                <ColumnDefinition Width="150" />
                                                <ColumnDefinition Width="*" />
                                            </Grid.ColumnDefinitions>
                                            <StackLayout Orientation="Horizontal">
                                                <Button
                                                Margin="0"
                                                BackgroundColor="Red"
                                                BorderRadius="0"
                                                Clicked="SampleClickHandler"
                                                Image="location.png"
                                                WidthRequest="50" />
                                                <Button
                                                Margin="0"
                                                BackgroundColor="Blue"
                                                BorderRadius="0"
                                                Clicked="SampleClickHandler"
                                                Image="mail.png"
                                                WidthRequest="50" />
                                                <Button
                                                Margin="0"
                                                BackgroundColor="Azure"
                                                BorderRadius="0"
                                                Clicked="SampleClickHandler"
                                                Image="phone.png"
                                                WidthRequest="50" />
                                            </StackLayout>
     
                                        </Grid>
                                    </DataTemplate>
                                </telerikDataControls:RadListView.ItemSwipeContentTemplate>
                            </telerikDataControls:RadListView>
     
                        </telerikPrimitives:TabViewItem.Content>
                    </telerikPrimitives:TabViewItem>
                    <telerikPrimitives:TabViewItem HeaderText="Folder">
                        <telerikPrimitives:TabViewItem.Content>
                            <Label Margin="10" Text="This is the content of the Folder tab" />
                        </telerikPrimitives:TabViewItem.Content>
                    </telerikPrimitives:TabViewItem>
                    <telerikPrimitives:TabViewItem HeaderText="View">
                        <telerikPrimitives:TabViewItem.Content>
                            <Label Margin="10" Text="This is the content of the View tab" />
                        </telerikPrimitives:TabViewItem.Content>
                    </telerikPrimitives:TabViewItem>
                </telerikPrimitives:RadTabView.Items>
            </telerikPrimitives:RadTabView>
        </ContentPage.Content>
    </ContentPage>

     

    The view model was as follows.

     

    public class PersonViewModel
    {
        public int PersonId { get; set; }
        public string Name { get; set; }
        public string Description { get; set; }
        public string ProfilePictureUrl { get; set; }
    }

     

    Have a great week,

    Mikhail

  4. Stefan Nenchev
    Admin
    Stefan Nenchev avatar
    503 posts

    Posted 21 Jul Link to this post

    Hello Mikhail,

    I have tested the scenario with a setup similar to yours, according to your latest update, but was still not able to observe the behavior. Did you have the chance to investigate the issue further?  Sharing some additional information, if you have such, will be appreciated.

    Regards,
    Stefan Nenchev
    Progress Telerik
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
Back to Top