如何使我的滚动视图/网格中的图像以正常大小适合屏幕宽度？

Question

我正在使用滚动视图/网格！在我的网格内，我有一个图像、按钮和一个标签。

在此页面中，我从我的数据库中收集了我的图像，这意味着图像会根据您事先单击的类别而有所不同。这意味着图像并不总是相同的高度/宽度。

有些看起来不错（它们以正常高度填满整个屏幕），但有些根本不填满屏幕。如果我做一个AspectFill，一些图片会被截断，我也不想要。我也尝试过Fill，但这会使情况变得更糟。

这是我正在使用的：

    <ScrollView HorizontalOptions = "FillAndExpand" VerticalOptions = "FillAndExpand" >
    <StackLayout HorizontalOptions = "FillAndExpand" VerticalOptions = "FillAndExpand">

    <Grid>

        <Grid.RowDefinitions>

            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>

        </Grid.RowDefinitions>

        <StackLayout Grid.Row="0" BackgroundColor = "Red" HorizontalOptions = "FillAndExpand" VerticalOptions = "FillAndExpand">

            <Image  x:Name="theimage" Aspect = "AspectFit"  HorizontalOptions = "FillAndExpand" VerticalOptions = "FillAndExpand" />

            <Button Clicked="clickFunc" TextColor="White" Grid.Row="1" HeightRequest="80" WidthRequest="120" BorderRadius="40" HorizontalOptions="End" VerticalOptions="Start" />

        <StackLayout Grid.Row="1" Padding="10,20,10,0">

            <Label TextColor = "#474747" x:Name="title" Text="" HorizontalOptions="Start" FontFamily="Helvetica Neue" FontAttributes="Bold" />

        </StackLayout>
        </StackLayout>
    </Grid> 
    </StackLayout>
    </ScrollView>

我试图这样做来解决这个问题：

theimage.WidthRequest = App.ScreenWidth;

我从 AppDelegete 获得 ScreenWidth，但 theimage 根本没有改变它的宽度。如果我尝试在 xaml 中像这样手动添加一个数字：

WidthRequest = "500"

图像也没有改变，所以我在图像方面有点没有想法。

那么我该如何调整我的代码，以使我的图像在保持正常尺寸的同时始终完全布局到屏幕宽度？

Answer 1

嗯，是的，您还必须指定 Grid.Row 和 Grid.Column 才能找到网格的确切位置。 我已经更改了您的代码，如下所示：（我更改的值仅用于展示）

    <Grid.RowDefinitions>

        <RowDefinition Height="Auto"/>
        <RowDefinition Height="100"/>

    </Grid.RowDefinitions>

    <StackLayout Grid.Row="0" BackgroundColor = "Red" HorizontalOptions = "FillAndExpand" VerticalOptions = "FillAndExpand">

        <Image Grid.Row="1"  x:Name="theimage" Aspect = "AspectFit"  HorizontalOptions = "FillAndExpand" VerticalOptions = "FillAndExpand" />

        <Button Clicked="clickFunc" TextColor="White" Grid.Row="1" HeightRequest="80" WidthRequest="120" BorderRadius="40" HorizontalOptions="End" VerticalOptions="Start" />

    <StackLayout Grid.Row="1" Padding="10,20,10,0">

        <Label TextColor = "#474747" x:Name="title" Text="" HorizontalOptions="Start" FontFamily="Helvetica Neue" FontAttributes="Bold" />

    </StackLayout>
    </StackLayout>
</Grid> 

请参阅 XAML 文档，了解如何使用网格。

http://www.dailyfreecode.com/code/grid-layout-xaml-212.aspx http://www.c-sharpcorner.com/uploadfile/mahesh/grid-in-wpf/

注意：您必须为每一行提供行定义，同样适用于列定义。