Question

我正在尝试使用如下的grid和stackLayout创建一个xamarin表单。在这两种情况下，第二列控件都没有开始垂直一致地对齐。

使用GRID控件的XAML：

<BoxView Style="{StaticResource separator}"></BoxView>
        <StackLayout Orientation="Vertical" Style="{StaticResource layoutTitle}">
            <Label Text="MANAGE PROFILE"  Style="{StaticResource labelTitle}"></Label>
        </StackLayout>
    <BoxView  Style="{StaticResource separator}"></BoxView>

    <Grid BackgroundColor="{StaticResource whiteBackgroundColor}">
       <Grid.RowDefinitions>
            <RowDefinition Height="44"></RowDefinition>
            <RowDefinition Height="1"></RowDefinition>
            <RowDefinition Height="44"></RowDefinition>
            <RowDefinition Height="1"></RowDefinition>
            <RowDefinition Height="44"></RowDefinition>
            <RowDefinition Height="1"></RowDefinition>
            <RowDefinition Height="44"></RowDefinition>
            <RowDefinition Height="1"></RowDefinition>
            <RowDefinition Height="44"></RowDefinition>
            <RowDefinition Height="1"></RowDefinition>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="*" />
            <ColumnDefinition Width="*" />
        </Grid.ColumnDefinitions>

        <StackLayout Grid.Row="0" Grid.ColumnSpan="2" Orientation="Horizontal" BackgroundColor="{StaticResource whiteBackgroundColor}" Style="{StaticResource layoutSpacingFormEntry}">  
            <Label Grid.Row="0" Grid.Column="0" Text="AddressLine1" Style="{StaticResource labelStandard}"></Label>
            <Entry  Grid.Row="0" Grid.Column="1" HorizontalOptions="FillAndExpand" Placeholder="required" Text="{Binding AddressLine1.Value}">
                    <Entry.Effects>
                        <effects:EntryNoBorderEffect />
                    </Entry.Effects>
                    <Entry.Behaviors>
                        <behaviors:EventToCommandBehavior EventName="TextChanged" Command="{Binding AddressLine1.TriggerValidationCommand}" />
                    </Entry.Behaviors>
                    <Entry.Triggers>
                        <DataTrigger TargetType="Entry" Binding="{Binding AddressLine1.IsValid}" Value="False">
                            <Setter Property="behaviors:EntryErrorColorBehavior.LineColor" Value="{StaticResource ErrorColor}" />
                        </DataTrigger>
                    </Entry.Triggers>
             </Entry>
         </StackLayout>
         <BoxView  Grid.Row="1" Grid.ColumnSpan="2" Style="{StaticResource separator}"></BoxView>

         <StackLayout Grid.Row="2" Grid.ColumnSpan="2" Orientation="Horizontal" BackgroundColor="{StaticResource whiteBackgroundColor}" Style="{StaticResource layoutSpacingFormEntry}">
            <Label Grid.Row="2" Grid.Column="0" Text="AddressLine2" Style="{StaticResource labelStandard}"></Label>
            <Entry Grid.Row="2" Grid.Column="1" HorizontalOptions="FillAndExpand" Placeholder="required" Text="{Binding AddressLine2.Value}">
                <Entry.Effects>
                    <effects:EntryNoBorderEffect />
                </Entry.Effects>
                <Entry.Behaviors>
                    <behaviors:EventToCommandBehavior EventName="TextChanged" Command="{Binding AddressLine2.TriggerValidationCommand}" />
                </Entry.Behaviors>
                <Entry.Triggers>
                    <DataTrigger TargetType="Entry" Binding="{Binding AddressLine2.IsValid}" Value="False">
                        <Setter Property="behaviors:EntryErrorColorBehavior.LineColor" Value="{StaticResource ErrorColor}" />
                    </DataTrigger>
                </Entry.Triggers>
            </Entry>
        </StackLayout>
        <BoxView  Grid.Row="3" Grid.ColumnSpan="2" Style="{StaticResource separator}"></BoxView>

        <StackLayout Grid.Row="4" Grid.ColumnSpan="2" Orientation="Horizontal" BackgroundColor="{StaticResource whiteBackgroundColor}" Style="{StaticResource layoutSpacingFormEntry}">
            <Label Grid.Row="4" Grid.Column="0" Text="Suburb" Style="{StaticResource labelStandard}"></Label>
            <Entry Grid.Row="4" Grid.Column="1" HorizontalOptions="FillAndExpand" Placeholder="required" Text="{Binding Suburb.Value}">
                <Entry.Effects>
                    <effects:EntryNoBorderEffect />
                </Entry.Effects>
                <Entry.Behaviors>
                    <behaviors:EventToCommandBehavior EventName="TextChanged" Command="{Binding Suburb.TriggerValidationCommand}" />
                </Entry.Behaviors>
                <Entry.Triggers>
                    <DataTrigger TargetType="Entry" Binding="{Binding Suburb.IsValid}" Value="False">
                        <Setter Property="behaviors:EntryErrorColorBehavior.LineColor" Value="{StaticResource ErrorColor}" />
                    </DataTrigger>
                </Entry.Triggers>
            </Entry>
        </StackLayout>

        <BoxView Grid.Row="5" Grid.ColumnSpan="2"  Style="{StaticResource separator}"></BoxView>

        <StackLayout Grid.Row="6" Grid.ColumnSpan="2" Orientation="Horizontal" BackgroundColor="{StaticResource whiteBackgroundColor}" Style="{StaticResource layoutSpacingFormEntry}">  
            <Label Grid.Row="6" Grid.Column="0" Text="State" Style="{StaticResource labelStandard}" ></Label>
            <Picker Grid.Row="6" Grid.Column="1" HorizontalOptions="FillAndExpand" 
                    Title="Select" SelectedItem="{Binding State.Value}">
                <Picker.ItemsSource>
                    <x:Array Type="{x:Type x:String}">
                      <x:String>NSW</x:String>
                      <x:String>WA</x:String>
                      <x:String>QLD</x:String>
                      <x:String>SA</x:String>
                      <x:String>VIC</x:String>
                      <x:String>TAS</x:String>
                    </x:Array>
                  </Picker.ItemsSource>
            </Picker>
         </StackLayout>
         <BoxView Grid.Row="7" Grid.ColumnSpan="2" Style="{StaticResource separator}"></BoxView>

         <StackLayout Grid.Row="8" Grid.ColumnSpan="2" Orientation="Horizontal" BackgroundColor="{StaticResource whiteBackgroundColor}" Style="{StaticResource layoutSpacingFormEntry}">
            <Label Grid.Row="8" Grid.Column="0" Text="Post Code" Style="{StaticResource labelStandard}"></Label>
            <Entry Grid.Row="8" Grid.Column="1" HorizontalOptions="FillAndExpand" Placeholder="required" Text="{Binding PostCode.Value}">
                <Entry.Effects>
                    <effects:EntryNoBorderEffect />
                </Entry.Effects>
                <Entry.Behaviors>
                    <behaviors:EventToCommandBehavior EventName="TextChanged" Command="{Binding PostCode.TriggerValidationCommand}" />
                </Entry.Behaviors>
                <Entry.Triggers>
                    <DataTrigger TargetType="Entry" Binding="{Binding PostCode.IsValid}" Value="False">
                        <Setter Property="behaviors:EntryErrorColorBehavior.LineColor" Value="{StaticResource ErrorColor}" />
                    </DataTrigger>
                </Entry.Triggers>
            </Entry>
        </StackLayout>
        <BoxView Grid.Row="9" Grid.ColumnSpan="2" Style="{StaticResource separator}"></BoxView>
    </Grid>

使用StackLayout的XAML，

<BoxView Style="{StaticResource separator}"></BoxView>
          <StackLayout Orientation="Vertical" Style="{StaticResource layoutTitle}" BackgroundColor="#EFEFF4">
            <Label Text="MANAGE PROFILE"  Style="{StaticResource labelTitle}"></Label>
          </StackLayout>
          <BoxView  Style="{StaticResource separator}"></BoxView>
        <StackLayout Orientation="Horizontal" BackgroundColor="{StaticResource whiteBackgroundColor}" Style="{StaticResource layoutSpacingFormEntry}">
            <Label Text="AddressLine1" Style="{StaticResource labelStandard}" WidthRequest="100"></Label>
            <Entry x:Name="AddressLine1" HorizontalOptions="FillAndExpand" Placeholder="required" Text="{Binding AddressLine1.Value}">
                <Entry.Effects>
                    <effects:EntryNoBorderEffect />
                </Entry.Effects>
                <Entry.Behaviors>
                    <behaviors:EventToCommandBehavior EventName="TextChanged" Command="{Binding AddressLine1.TriggerValidationCommand}" />
                </Entry.Behaviors>
                <Entry.Triggers>
                    <DataTrigger TargetType="Entry" Binding="{Binding AddressLine1.IsValid}" Value="False">
                        <Setter Property="behaviors:EntryErrorColorBehavior.LineColor" Value="{StaticResource ErrorColor}" />
                    </DataTrigger>
                </Entry.Triggers>
            </Entry>
        </StackLayout>
        <BoxView  Style="{StaticResource separator}"></BoxView>
        <StackLayout Orientation="Horizontal" BackgroundColor="{StaticResource whiteBackgroundColor}" Style="{StaticResource layoutSpacingFormEntry}">
            <Label Text="AddressLine2" Style="{StaticResource labelStandard}" WidthRequest="100"></Label>
            <Entry x:Name="AddressLine2" HorizontalOptions="FillAndExpand" Placeholder="required" Text="{Binding AddressLine2.Value}">
                <Entry.Effects>
                    <effects:EntryNoBorderEffect />
                </Entry.Effects>
                <Entry.Behaviors>
                    <behaviors:EventToCommandBehavior EventName="TextChanged" Command="{Binding AddressLine2.TriggerValidationCommand}" />
                </Entry.Behaviors>
                <Entry.Triggers>
                    <DataTrigger TargetType="Entry" Binding="{Binding AddressLine2.IsValid}" Value="False">
                        <Setter Property="behaviors:EntryErrorColorBehavior.LineColor" Value="{StaticResource ErrorColor}" />
                    </DataTrigger>
                </Entry.Triggers>
            </Entry>
        </StackLayout>
        <BoxView  Style="{StaticResource separator}"></BoxView>
        <StackLayout Orientation="Horizontal" BackgroundColor="{StaticResource whiteBackgroundColor}" Style="{StaticResource layoutSpacingFormEntry}">
            <Label Text="Suburb" Style="{StaticResource labelStandard}" WidthRequest="100"></Label>
            <Entry x:Name="Suburb" HorizontalOptions="FillAndExpand" Placeholder="required" Text="{Binding Suburb.Value}">
                <Entry.Effects>
                    <effects:EntryNoBorderEffect />
                </Entry.Effects>
                <Entry.Behaviors>
                    <behaviors:EventToCommandBehavior EventName="TextChanged" Command="{Binding Suburb.TriggerValidationCommand}" />
                </Entry.Behaviors>
                <Entry.Triggers>
                    <DataTrigger TargetType="Entry" Binding="{Binding Suburb.IsValid}" Value="False">
                        <Setter Property="behaviors:EntryErrorColorBehavior.LineColor" Value="{StaticResource ErrorColor}" />
                    </DataTrigger>
                </Entry.Triggers>
            </Entry>
        </StackLayout>

        <BoxView  Style="{StaticResource separator}"></BoxView>
        <StackLayout Orientation="Horizontal" BackgroundColor="{StaticResource whiteBackgroundColor}" Style="{StaticResource layoutSpacingFormEntry}">
            <Label  x:Name="State" Text="State" Style="{StaticResource labelStandard}" WidthRequest="100"></Label>
            <Picker x:Name="pickerState" HorizontalOptions="FillAndExpand" 
                    Title="Select" SelectedItem="{Binding State.Value}">
                <Picker.ItemsSource>
                    <x:Array Type="{x:Type x:String}">
                      <x:String>NSW</x:String>
                      <x:String>WA</x:String>
                      <x:String>QLD</x:String>
                      <x:String>SA</x:String>
                      <x:String>VIC</x:String>
                      <x:String>TAS</x:String>
                    </x:Array>
                  </Picker.ItemsSource>
            </Picker>
        </StackLayout>
        <BoxView  Style="{StaticResource separator}"></BoxView>
        <StackLayout Orientation="Horizontal" BackgroundColor="{StaticResource whiteBackgroundColor}" Style="{StaticResource layoutSpacingFormEntry}">
            <Label Text="Post Code" Style="{StaticResource labelStandard}" WidthRequest="100"></Label>
            <Entry x:Name="PostCode" HorizontalOptions="FillAndExpand" Placeholder="required" Text="{Binding PostCode.Value}">
                <Entry.Effects>
                    <effects:EntryNoBorderEffect />
                </Entry.Effects>
                <Entry.Behaviors>
                    <behaviors:EventToCommandBehavior EventName="TextChanged" Command="{Binding PostCode.TriggerValidationCommand}" />
                </Entry.Behaviors>
                <Entry.Triggers>
                    <DataTrigger TargetType="Entry" Binding="{Binding PostCode.IsValid}" Value="False">
                        <Setter Property="behaviors:EntryErrorColorBehavior.LineColor" Value="{StaticResource ErrorColor}" />
                    </DataTrigger>
                </Entry.Triggers>
            </Entry>
        </StackLayout>
        <BoxView Style="{StaticResource separator}"></BoxView>

在两种情况下，第二列均基于文本值开始。即使我添加HorizontalOptions =“ StartAndExpand”，也无法在第二列中将所有窗体控件垂直对齐。

按如下所示获取用户界面，

我现在在XAML中都添加了两个控件。表单的顶部使用GRID控件。下面重复的部分使用StackLayout控件

请让我知道我在做什么错

Answer 1

您已将列宽设置为“ ”。如果要垂直对齐控件，则需要将列的大小设置为“ 50 ”，“ 50 *”或“ 60 *”，“ 40 *”。它将以％设置宽度。

Xamarin表单：无法创建左对齐的2列网格

1 个答案: