Question

我定义了一个网格来放置我的视图但我需要垂直滚动才能看到它们。在我的代码中应该添加ScrollView？在网格内？这是我目前的代码。我也会接受批评如何更好地构建这个页面。我是一个相对新手。

<ContentPage Title="Browse Providers">
    <Grid BackgroundColor="#689dff">
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <Label Grid.Row="1" Grid.Column="2" Grid.ColumnSpan="20" Grid.RowSpan="4" Text="Browse Service Providers" 
    FontSize="28">
    </Label>
    <Button Grid.Row="5" Grid.Column="6" Grid.ColumnSpan="10" Grid.RowSpan="4" Text="Videography" FontSize="20" 
    TextColor="Green">
    </Button>
    <Button Grid.Row="8" Grid.Column="6" Grid.ColumnSpan="10" Grid.RowSpan="4" Text="Babysitting" FontSize="20" 
    TextColor="Green">
    </Button>
    <Button Grid.Row="11" Grid.Column="6" Grid.ColumnSpan="10" Grid.RowSpan="4" Text="Pet Sitting" FontSize="20" 
    TextColor="Green">
    </Button>
    <Button Grid.Row="14" Grid.Column="6" Grid.ColumnSpan="10" Grid.RowSpan="4" Text="Lawn Care" FontSize="20" 
    TextColor="Green">
    </Button>
    <Button Grid.Row="17" Grid.Column="6" Grid.ColumnSpan="10" Grid.RowSpan="4" Text="Appliance Repair" FontSize="20" 
    TextColor="Green">
    </Button>
    <Button Grid.Row="20" Grid.Column="6" Grid.ColumnSpan="10" Grid.RowSpan="4" Text="Graphic Design" FontSize="20" 
    TextColor="Green">
    </Button>
    <Button Grid.Row="23" Grid.Column="6" Grid.ColumnSpan="10" Grid.RowSpan="4" Text="Photography" FontSize="20" 
    TextColor="Green">
    </Button>
    <Button Grid.Row="26" Grid.Column="6" Grid.ColumnSpan="10" Grid.RowSpan="4" Text="Painting" FontSize="20" 
    TextColor="Green">
    </Button>
    <Button Grid.Row="29" Grid.Column="6" Grid.ColumnSpan="10" Grid.RowSpan="4" Text="Plumbing" FontSize="20" 
    TextColor="Green">
    </Button>
    <Button Grid.Row="32" Grid.Column="5" Grid.ColumnSpan="12" Grid.RowSpan="4" Text="House Cleaning" FontSize="20" 
    TextColor="Green">
    </Button>
</Grid>
</ContentPage>

Answer 1

用GridView：

包裹您的ScrollView

<ScrollView>
   <GridView />
</ScrollView/>

很少有建议：
1）使用styles，仅定义TextColor和FontSize一次 2）如果您的所有Rows＆amp; Columns应该具有相同或相似的大小来简化定义：

<ColumnDefinition />
<RowDefinition />

可以找到有关Grid布局的更多信息here。

3）熟悉＆＃34; Xamarin.Forms Performance＆＃34; guide。
4）如果您不熟悉Xamarin.Forms和XAML，请使用XAMLC。

祝你好运。

我应该在哪里将ScrollView声明放在我的XAML层次结构中？ Xamarin.Forms

1 个答案: