在 Xamarin 的 ScrollView 中使用 Frame 时如何显示 2 行

How to display 2 rows when using Frame inside ScrollView in Xamarin

我有一个 ScrollView 问题如下:我有一个类别列表。我希望它显示 2 行类别。我搜索了与 ScrollView 相关的所有内容,但没有看到任何结果。

<ScrollView Orientation="Horizontal" VerticalScrollBarVisibility="Never" HorizontalScrollBarVisibility="Never">
    <StackLayout Padding="12,0" Orientation="Horizontal" HorizontalOptions="CenterAndExpand" VerticalOptions="CenterAndExpand">
        <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff">
            <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                <Label Text="Food" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
            </StackLayout>
        </Frame>
        <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff">
            <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                <Label Text="Car" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
            </StackLayout>
        </Frame>
        <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff">
            <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                <Label Text="Travel" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
            </StackLayout>
        </Frame>
        <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff">
            <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                <Label Text="Travel 2" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
            </StackLayout>
        </Frame>
        <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff">
            <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                <Label Text="Computer" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
            </StackLayout>
        </Frame>
        <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff">
            <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                <Label Text="Computer 2" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
            </StackLayout>
        </Frame>
        <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff">
            <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                <Label Text="Computer 3" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
            </StackLayout>
        </Frame>
        <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff">
            <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                <Label Text="Computer 4" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
            </StackLayout>
        </Frame>
        <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff">
            <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                <Label Text="Computer 5" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
            </StackLayout>
        </Frame>
    </StackLayout>
</ScrollView>

我的想法是限制 ScrollView 的宽度,然后它自己会下降到 2 列的类别,但我认为这太有趣了 =]]]。但是它仍然不起作用。任何人对此有任何解决方案,我不会使用 Grid。谢谢。

这是我希望显示 2 行的内容:

更新

<ScrollView Orientation="Horizontal" VerticalScrollBarVisibility="Never" HorizontalScrollBarVisibility="Never">
    <FlexLayout Direction="Column">
        <FlexLayout FlexLayout.Grow="1">
            <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                    <Label Text="Food" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                </StackLayout>
            </Frame>
            <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                    <Label Text="Car" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                </StackLayout>
            </Frame>
            <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                    <Label Text="Travel" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                </StackLayout>
            </Frame>
            <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                    <Label Text="Travel 2" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                </StackLayout>
            </Frame>
            <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                    <Label Text="Travel 2" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                </StackLayout>
            </Frame>
            <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                    <Label Text="Travel 2" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                </StackLayout>
            </Frame>
            <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                    <Label Text="Travel 2" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                </StackLayout>
            </Frame>
            <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                    <Label Text="Travel 2" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                </StackLayout>
            </Frame>
            <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                    <Label Text="Travel 2" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                </StackLayout>
            </Frame>
            <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                    <Label Text="Travel 2" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                </StackLayout>
            </Frame>
            <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                    <Label Text="Travel 2" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                </StackLayout>
            </Frame>
            <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                    <Label Text="Travel 2" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                </StackLayout>
            </Frame>
            <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                    <Label Text="Travel 2" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                </StackLayout>
            </Frame>
        </FlexLayout>
        <FlexLayout FlexLayout.Grow="2">
            <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" >
                <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                    <Label Text="Computer" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                </StackLayout>
            </Frame>
            <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" >
                <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                    <Label Text="Computer 2" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                </StackLayout>
            </Frame>
            <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" >
                <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                    <Label Text="Computer 3" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                </StackLayout>
            </Frame>
            <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" >
                <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                    <Label Text="Computer 4" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                </StackLayout>
            </Frame>
            <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" >
                <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                    <Label Text="Computer 5" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                </StackLayout>
            </Frame>
        </FlexLayout>
    </FlexLayout>
</ScrollView>

结果:

Jason说用FlexLayout就可以,我写了个例子给大家参考。

这里是 xaml 代码:

<ScrollView Orientation="Vertical" VerticalScrollBarVisibility="Never" HorizontalScrollBarVisibility="Never">
    <FlexLayout Direction="Column">
        <FlexLayout FlexLayout.Grow="1">
            <ScrollView Orientation="Horizontal">
                <StackLayout Orientation="Horizontal" >
                    <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                        <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                            <Label Text="Food" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                        </StackLayout>
                    </Frame>
                    <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                        <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                            <Label Text="Car" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                        </StackLayout>
                    </Frame>
                    <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                        <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                            <Label Text="Travel" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                        </StackLayout>
                    </Frame>
                    <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                        <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                            <Label Text="Travel 2" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                        </StackLayout>
                    </Frame>
                    <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                        <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                            <Label Text="Travel 2" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                        </StackLayout>
                    </Frame>
                    <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                        <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                            <Label Text="Travel 2" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                        </StackLayout>
                    </Frame>
                    <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                        <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                            <Label Text="Travel 2" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                        </StackLayout>
                    </Frame>
                    <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                        <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                            <Label Text="Travel 2" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                        </StackLayout>
                    </Frame>
                    <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                        <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                            <Label Text="Travel 2" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                        </StackLayout>
                    </Frame>
                    <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                        <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                            <Label Text="Travel 2" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                        </StackLayout>
                    </Frame>
                    <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                        <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                            <Label Text="Travel 2" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                        </StackLayout>
                    </Frame>
                    <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                        <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                            <Label Text="Travel 2" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                        </StackLayout>
                    </Frame>
                    <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                        <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                            <Label Text="Travel 2" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                        </StackLayout>
                    </Frame>
                </StackLayout>
            </ScrollView>
        </FlexLayout>
        <FlexLayout FlexLayout.Grow="2">
            <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" >
                <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                    <Label Text="Computer" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                </StackLayout>
            </Frame>
            <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" >
                <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                    <Label Text="Computer 2" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                </StackLayout>
            </Frame>
            <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" >
                <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                    <Label Text="Computer 3" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                </StackLayout>
            </Frame>
            <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" >
                <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                    <Label Text="Computer 4" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                </StackLayout>
            </Frame>
            <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" >
                <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                    <Label Text="Computer 5" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                </StackLayout>
            </Frame>
        </FlexLayout>
    </FlexLayout>
</ScrollView>

感谢上面的解决方法,下面是我根据需要自定义的代码:

<ScrollView Orientation="Vertical" VerticalScrollBarVisibility="Never" HorizontalScrollBarVisibility="Never">
    <FlexLayout Direction="Column">
        <ScrollView Orientation="Horizontal" VerticalScrollBarVisibility="Never" HorizontalScrollBarVisibility="Never">
            <StackLayout Orientation="Vertical">
                <FlexLayout FlexLayout.Grow="1">
                    <StackLayout Orientation="Horizontal" >
                        <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                            <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                                <Label Text="Food" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                            </StackLayout>
                        </Frame>
                        <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                            <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                                <Label Text="Car" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                            </StackLayout>
                        </Frame>
                        <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                            <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                                <Label Text="Travel" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                            </StackLayout>
                        </Frame>
                        <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                            <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                                <Label Text="Travel 2" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                            </StackLayout>
                        </Frame>
                        <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                            <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                                <Label Text="Travel 2" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                            </StackLayout>
                        </Frame>
                        <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                            <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                                <Label Text="Travel 2" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                            </StackLayout>
                        </Frame>
                        <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                            <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                                <Label Text="Travel 2" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                            </StackLayout>
                        </Frame>
                        <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                            <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                                <Label Text="Travel 2" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                            </StackLayout>
                        </Frame>
                        <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" FlexLayout.Grow="1">
                            <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                                <Label Text="Travel 2" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                            </StackLayout>
                        </Frame>
                    </StackLayout>
                </FlexLayout>
                <FlexLayout FlexLayout.Grow="2">
                    <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" >
                        <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                            <Label Text="Computer" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                        </StackLayout>
                    </Frame>
                    <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" >
                        <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                            <Label Text="Computer 2" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                        </StackLayout>
                    </Frame>
                    <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" >
                        <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                            <Label Text="Computer 3" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                        </StackLayout>
                    </Frame>
                    <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" >
                        <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                            <Label Text="Computer 4" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                        </StackLayout>
                    </Frame>
                    <Frame HasShadow="False" HorizontalOptions="Start" IsClippedToBounds="True" Padding="10,7" CornerRadius="7" BackgroundColor="#fff" >
                        <StackLayout Orientation="Horizontal" VerticalOptions="Center">
                            <Label Text="Computer 5sss" TextColor="#333" VerticalOptions="Center" FontSize="14"/>
                        </StackLayout>
                    </Frame>
                </FlexLayout>
            </StackLayout>
        </ScrollView>
    </FlexLayout>
</ScrollView>