Grial-UI-Kit-Support icon indicating copy to clipboard operation
Grial-UI-Kit-Support copied to clipboard

Grail:Repeater disable scroll and force height of contents

Open chriskooken opened this issue 3 years ago • 1 comments

I have a repeater inside a ListView. Hierarchy is ListView -> CardView -> Repeater. The repeater is in a vertical orientation. The problem I am having is the repeater is scrolling. I don't want it to scroll at all. I want it to just force the height of all the elements inside. If I set a heightRequest, it works fine, but the repeater items are dynamic, so I want it to happen automatically.

Screenshot 2021-10-19 at 11 11 27 AM

This is what it should look like: image

Code:

<?xml version="1.0" encoding="UTF-8" ?>
<ContentView
    xmlns="http://xamarin.com/schemas/2014/forms"
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
     xmlns:grial="http://uxdivers.com/grial"
    x:Class="BehaviorLive.Views.LiveEvent.LiveEventPolls">
    <ContentView.Content>
        <StackLayout>
            <Label Text="Polls" TextColor="White" FontSize="20"></Label>
            <ListView
						x:Name="pollsList"
						ItemsSource="{ Binding Polls}" 
						SeparatorVisibility="None"
						HasUnevenRows="true"
						SelectionMode="None"			
						>
                <ListView.ItemTemplate>
                    <DataTemplate>
                        <ViewCell>
                            <grial:CardView 
						Padding="5,15"
						Margin="10"
						RowSpacing="10"
						ColumnSpacing="4"
						CornerRadius="5"
                                                VerticalOptions="FillAndExpand"
                                                BackgroundColor="White">
                                <grial:CardView.ColumnDefinitions>

                                    <ColumnDefinition Width="*"></ColumnDefinition>
                                </grial:CardView.ColumnDefinitions>

                                <grial:CardView.RowDefinitions>
                                    <RowDefinition Height="auto"></RowDefinition>
                                    <RowDefinition Height="*"></RowDefinition>
                                </grial:CardView.RowDefinitions>

                                <Label Grid.Column="0" Grid.Row="0" Text="{Binding QuestionText}" VerticalOptions="Start" TextColor="Black" FontSize="20"></Label>

                                <grial:Repeater Grid.Column="0" VerticalOptions="FillAndExpand" ScrollBarVisibility="Never"   Grid.Row="1" ItemsSource="{Binding Options}" Orientation="Vertical" Spacing="5">
                                    <grial:Repeater.ItemTemplate >
                                        <DataTemplate>
                                            <Grid VerticalOptions="FillAndExpand">
                                                <Grid.ColumnDefinitions>
                                                    <ColumnDefinition Width="60"></ColumnDefinition>
                                                    <ColumnDefinition Width="*"></ColumnDefinition>
                                                </Grid.ColumnDefinitions>
                                                <Grid.RowDefinitions>
                                                    <RowDefinition Height="auto"></RowDefinition>
                                                    <RowDefinition Height="auto"></RowDefinition>
                                                    <RowDefinition Height="auto"></RowDefinition>
                                                </Grid.RowDefinitions>

                                                <Button Grid.Column="0" Grid.Row="0" Grid.RowSpan="4" VerticalOptions="StartAndExpand" Text="Vote" FontAttributes="Bold" FontSize="16" BackgroundColor="#ffc107" TextColor="Black" />

                                                <ProgressBar Grid.Column="1" Grid.Row="1" Progress="0.5" ScaleY="3" ProgressColor="DarkRed" />
                                                <Label Grid.Column="1" Grid.Row="2" Text="{Binding OptionText}" TextColor="Black" FontSize="19"></Label>

                                            </Grid>

                                        </DataTemplate>
                                    </grial:Repeater.ItemTemplate>
                                </grial:Repeater>

                            </grial:CardView>
                        </ViewCell>
                    </DataTemplate>
                </ListView.ItemTemplate>
            </ListView>


        </StackLayout>
    </ContentView.Content>
</ContentView>
```

chriskooken avatar Oct 19 '21 15:10 chriskooken

Please try using a GridView instead of a repeater if you want them all to be visible.

dirivero avatar Nov 16 '21 16:11 dirivero