question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Strange rendering in TabControl and Carousel Layout

See original GitHub issue

@AndreiMisiukevich Sorry for open this issue again, but it really happen regularly in my app, emulators can not reproduce, only the real devices can get that issue. The TabControl sometimes break layout with bigger height, and the Carousel Layout sometimes is cropped at bottom. I even don’t know why the issue happened, few days ago, I thought it related to Absolute layout issue of xamarin forms. Can you take time to check it. Thank you so much

giphy

 <cards:CarouselView x:Name="ScoresCarouselView"
                            HorizontalOptions="FillAndExpand"
                            IsCyclical="False"
                            IsViewReusingEnabled="False"
                            BackViewsDepth="1"
                            ItemAppearedCommand="{Binding ScoreItemAppearedCommand}"
                            ItemDisappearingCommand="{Binding ScoreItemDisappearingCommand}"
                            ItemsSource="{Binding ScoreItemSources}"
                            SelectedItem="{Binding SelectedScoreItem}"
                            VerticalOptions="FillAndExpand">
            <x:Arguments>
                <processors:BaseCarouselFrontViewProcessor AnimationLength="250"
                                                           NoItemMaxPanDistance="1000"
                                                           OpacityFactor="0.25" />
                <processors:BaseCarouselBackViewProcessor AnimationLength="250"
                                                          OpacityFactor="0.25" />
            </x:Arguments>
            <cards:CarouselView.ItemTemplate>
                <DataTemplate x:DataType="viewModels:ScoreItemViewModel">
                    <FlexLayout JustifyContent="Center">
                        <Label FlexLayout.AlignSelf="Center"
                               IsVisible="{Binding IsComingSoon}"
                               Style="{StaticResource NotificationLabel}"
                               Text="Coming Soon" />
                        <StackLayout IsVisible="{Binding IsNotComingSoon}">
                            <Label IsVisible="{Binding NoData}"
                                   Style="{StaticResource NotificationLabel}"
                                   Text="{langs:Translate NoGames}" />
                            <customListView:CustomListView x:Name="LeagueTable"
                                                           AutomationId="LeagueTableId"
                                                           AutomationProperties.IsInAccessibleTree="False"
                                                           Footer="{Binding .}"
                                                           GroupDisplayBinding="{Binding Key}"
                                                           GroupHeaderTemplate="{StaticResource MatchHeaderTemplate}"
                                                           HasUnevenRows="true"
                                                           IsGroupingEnabled="True"
                                                           IsPullToRefreshEnabled="true"
                                                           IsRefreshing="{Binding IsRefreshing}"
                                                           ItemTemplate="{StaticResource MatchItemTemplateSelector}"
                                                           ItemsSource="{Binding MatchItemsSource}"
                                                           LoadMoreCommand="{Binding LoadMoreCommand}"
                                                           RefreshCommand="{Binding RefreshCommand}"
                                                           RefreshControlColor="White"
                                                           SelectionMode="None"
                                                           SeparatorVisibility="None"
                                                           Style="{StaticResource ListViewHasBackground}"
                                                           TriggerLoadMoreIndex="1"
                                                           VerticalOptions="FillAndExpand">
                                <x:Arguments>
                                    <ListViewCachingStrategy>RecycleElementAndDataTemplate</ListViewCachingStrategy>
                                </x:Arguments>
                                <customListView:CustomListView.Behaviors>
                                    <b:EventToCommandBehavior Command="{Binding TappedMatchCommand}"
                                                              EventArgsParameterPath="Item"
                                                              EventName="ItemTapped" />
                                </customListView:CustomListView.Behaviors>
                                <customListView:CustomListView.FooterTemplate>
                                    <DataTemplate>
                                        <StackLayout>
                                            <coreTemplates:MatchSkeletonTemplate />
                                            <coreTemplates:MatchSkeletonTemplate IsVisible="{Binding IsNotLoadMore}" />
                                            <coreTemplates:MatchSkeletonTemplate IsVisible="{Binding IsNotLoadMore}" />
                                            <coreTemplates:MatchSkeletonTemplate IsVisible="{Binding IsNotLoadMore}" />
                                        </StackLayout>
                                    </DataTemplate>
                                </customListView:CustomListView.FooterTemplate>
                            </customListView:CustomListView>
                        </StackLayout>
                    </FlexLayout>
                </DataTemplate>
            </cards:CarouselView.ItemTemplate>
        </cards:CarouselView>

TabControl DataTemplate

<DataTemplate xmlns="http://xamarin.com/schemas/2014/forms"
              xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
              xmlns:d="http://xamarin.com/schemas/2014/forms/design"
              xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
              xmlns:views="clr-namespace:LiveScore.Core.Controls.DateBar.Views;assembly=LiveScore.Core"
              xmlns:converters="clr-namespace:LiveScore.Core.Controls.DateBar.Converters;assembly=LiveScore.Core"
              mc:Ignorable="d"
              x:Class="LiveScore.Core.Controls.DateBar.Views.Templates.DateTemplate">

    <FlexLayout HorizontalOptions="FillAndExpand"
                Direction="Column"
                Padding="0,12,0,12"
                AlignItems="Center"
                JustifyContent="SpaceBetween">
        <FlexLayout.Resources>
            <ResourceDictionary>
                <ResourceDictionary.MergedDictionaries>
                    <views:DateBarResource />
                </ResourceDictionary.MergedDictionaries>
                <converters:DayNameConverter x:Key="DayNameConverter" />
                <converters:DayMonthConverter x:Key="DayMonthConverter" />
                <converters:ActiveColorConverter x:Key="ActiveColorConverter" />
            </ResourceDictionary>
        </FlexLayout.Resources>
        <Label Text="{Binding ViewDate, Converter={StaticResource DayNameConverter}}"
               TextColor="{Binding IsActive, Converter={StaticResource ActiveColorConverter}}"
               Style="{StaticResource DateBarDayNameLabel}" />
        <Label Text="{Binding ViewDate, Converter={StaticResource DayMonthConverter}}"
               TextColor="{Binding IsActive, Converter={StaticResource ActiveColorConverter}}"
               Style="{StaticResource DateBarDayMonthLabel}" />
    </FlexLayout>
</DataTemplate>

Issue Analytics

  • State:closed
  • Created 4 years ago
  • Comments:37 (19 by maintainers)

github_iconTop GitHub Comments

1reaction
AndreiMisiukevichcommented, Dec 3, 2019

It is inside the DataTemplate, how can I set the height?

public MatchesTemplate()
        {
            InitializeComponent();
            (this.Parent.Parent as View).SizeChanged += (s, e) => 
        }
1reaction
AndreiMisiukevichcommented, Dec 3, 2019

It will help, because

        public MatchesTemplate()
        {
            InitializeComponent();
            MatchesListView.HeightRequest = 640;
        }

Helped for my iPhone XR… so, just do a workaround

Read more comments on GitHub >

github_iconTop Results From Across the Web

Modern Tab Control: Strange Text Display Problem
Solved: I have a Power App that I am testing a use case for a Modern Tab Contol. Oddly, when I create an...
Read more >
WPF 3D Tab Carousel
This article discusses how to create a 3D tab control for WPF. It will go through 3D rotation and camera calculations as well...
Read more >
Turn everything to slider, carousel, tabs with Gutencon plugin ...
In current point, our slider block is the most powerful Slider block ... template builder, for content formating or for attractive blocks.
Read more >
Let's talk about Native HTML Tabs
For the past year I've been on a team of folks inside Open UI dedicated to figuring out how get a native, accessible...
Read more >
Creating & using a UserControl
Nothing too strange though - a root UserControl element instead of the Window element, and then the DesignHeight and DesignWidth properties, which controls ......
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found