Xamarin 窗体中心网格水平答案

【问题标题】：Xamarin Forms Center Grid horizontalXamarin 窗体中心网格水平
【发布时间】：2020-06-02 22:24:53
【问题描述】：

我有问题。我正在尝试实现以下网格：

为此，我认为我应该将ColumnWidth 设置为Auto 并将Grid 的HorizontalOptions 设置为Center，因此网格位于屏幕中间创建左侧和右侧的空间相等，但无论我尝试什么，我似乎都无法从右侧移动列。这是我现在拥有的：

这是我的代码：

<Frame BorderColor="#00D8FF" Padding="0" HorizontalOptions="FillAndExpand" BackgroundColor="Transparent">
    <StackLayout Orientation="Vertical">
        <CarouselView ItemsSource="{Binding coinDataList}" HeightRequest="50">
            <CarouselView.ItemTemplate>
                <DataTemplate>
                    <Grid RowSpacing="0" HorizontalOptions="Center">
                        <Grid.RowDefinitions>
                            <RowDefinition Height="25" />
                            <RowDefinition Height="25" />
                        </Grid.RowDefinitions>

                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="Auto" />
                            <ColumnDefinition Width="Auto" />
                        </Grid.ColumnDefinitions>

                        <Label Grid.Row="0" Grid.Column="1" Text="BTC-USDT" FontAttributes="Bold" TextColor="#00D8FF" FontSize="18"/>
                        <Label Grid.Row="1" Grid.Column="1" Text="9762.33" TextColor="White" FontSize="18"/>
                        <Label Grid.RowSpan="2" Grid.Column="2" Text="-$476.22  (-4.77%)" VerticalOptions="CenterAndExpand" FontAttributes="Bold" TextColor="Red" FontSize="18" Margin="15,0,0,0"/>
                    </Grid>
                </DataTemplate>
            </CarouselView.ItemTemplate>
        </CarouselView>
    </StackLayout>
</Frame>

如何创建我想要的结果？

【问题讨论】：

根据你的截图，你的网格有四列，但是你只设置了两列，请修改。那么如果要等空间，就需要设置ColumnDefinition Width="*"

标签： xaml xamarin xamarin.forms xamarin.android xamarin.ios

【解决方案1】：

你可以试试这个吗？

<Frame BorderColor="#00D8FF" Padding="0" HorizontalOptions="FillAndExpand" BackgroundColor="Transparent">
    <StackLayout Orientation="Vertical">
        <CarouselView ItemsSource="{Binding coinDataList}" HeightRequest="50">
            <CarouselView.ItemTemplate>
                <DataTemplate>
                    <Grid >
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto"/>
                            <RowDefinition Height="Auto"/>
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*"/>
                            <ColumnDefinition Width="Auto"/>
                            <ColumnDefinition Width="Auto"/>
                            <ColumnDefinition Width="*"/>
                        </Grid.ColumnDefinitions>

                        <Label Grid.Row="0" Grid.Column="1" Text="BTC-USDT" FontAttributes="Bold" TextColor="#00D8FF" FontSize="18"/>
                        <Label Grid.Row="1" Grid.Column="1" Text="9762.33" FontAttributes="Bold" TextColor="#00D8FF" FontSize="18"/>
                        <Label Grid.Row="0" Grid.Column="2" VerticalTextAlignment="Center" Text="-$476.22  (-4.77%)" FontAttributes="Bold" TextColor="#00D8FF" FontSize="18"/>

                    </Grid>
                </DataTemplate>
            </CarouselView.ItemTemplate>
        </CarouselView>
    </StackLayout>
</Frame>

【讨论】：