You need to enable JavaScript to run this app.
优惠活动
大模型
产品
解决方案
定价
更多

Xamarin.Forms中如何让Grid内的Button占满列宽并左对齐?

问题:ListView中Button左对齐且占满列宽的实现问题

我用Visual Studio 2019 + C#开发Android项目,在ListView的ItemTemplate里用Grid分两列布局,想要Button控件左对齐且占满所在列宽度。但设置HorizontalOptions="StartAndExpand"时,控件左对齐却没法占满列宽;移除该属性的话,控件默认居中且占满列宽。

我的XAML代码如下:

<Frame Grid.Row="1"
       Grid.Column="0" 
       Grid.ColumnSpan="3"
       BorderColor="Black"                                                               
       CornerRadius="5" 
       x:Name="frmresultados"
       BackgroundColor="WhiteSmoke"  >                                                 
              
    <control:AutoScrollListView x:Name="lstpedidos" 
                      ItemsSource="{Binding Pedidos}"
                      HorizontalScrollBarVisibility="Always"
                      VerticalScrollBarVisibility="Always" 
                      SeparatorColor="#1c1c1c"
                      >
        
        <control:AutoScrollListView.ItemTemplate>
        <DataTemplate>
            <ViewCell>
                <Grid RowDefinitions="*,Auto" ColumnDefinitions="50,*"
                      ColumnSpacing="1" 
                      >

                        <Button        x:Name="lblcantidad"
                                       Text="{Binding CantidadArt}"
                                       TextColor="White"
                                       BackgroundColor="Blue"
                                       FontSize="15" 
                                       FontAttributes="Bold"
                                       Grid.Row="0"
                                       Grid.Column="0"
                                       Margin="0,3,3,0"
                                       HorizontalOptions="Start"                                                           
                                       Command="{Binding Path=BindingContext.CambiarUnidadCommand,Source={x:Reference lstpedidos}}" 
                                       CommandParameter="{Binding .}"
                                    
                                        >
                                                 
                                  
                        </Button>


                        <Button        x:Name="lbldescripcion"
                                       Text="{Binding DescripcionArt}"
                                       TextColor="White"
                                       FontSize="15"
                                       BackgroundColor="Blue"
                                       FontAttributes="Bold"
                                       Grid.Row="0"
                                       Grid.Column="1"
                                       Margin="0,3,3,0"
                                       HorizontalOptions="StartAndExpand"
                                       >
                        </Button>



                    </Grid>
            </ViewCell>
        </DataTemplate>
    </control:AutoScrollListView.ItemTemplate>
</control:AutoScrollListView>
</Frame>

解决方案

要实现Button左对齐同时占满Grid列宽,需要分开控制控件的填充范围和文本的对齐方式:

  1. 设置HorizontalOptions="Fill":让Button完全填充所在Grid列的可用宽度
  2. 设置HorizontalTextAlignment="Start":让按钮内的文本左对齐

修改后的lbldescripcion Button代码示例:

<Button x:Name="lbldescripcion"
        Text="{Binding DescripcionArt}"
        TextColor="White"
        FontSize="15"
        BackgroundColor="Blue"
        FontAttributes="Bold"
        Grid.Row="0"
        Grid.Column="1"
        Margin="0,3,3,0"
        HorizontalOptions="Fill"
        HorizontalTextAlignment="Start" />

如果第一个Button(lblcantidad)也需要同样效果,按同样方式修改这两个属性即可。


内容的提问来源于stack exchange,提问作者Yoandry Castellanos

相关产品推荐
方舟 Agent Plan

超全模态模型 × Harness 升级,最新支持 Deepseek-V4.1-Flash、GLM-5.3 系列、Doubao-Seedream-5.0-pro、Kimi-K3 (部分), 限时 9.9 元起

最近更新时间:2026.07.08 12:18:30