0

我在 Xamarin 中相对较新,我正在尝试创建一个表单。

当没有包含其他堆栈布局时,第一个堆栈布局显示正常http://prntscr.com/os7703

添加第二个堆栈布局后,我得到了这个http://prntscr.com/os733e

这是我正在使用的代码:

<ContentPage.Content>
        <StackLayout>
            <grial:TabControl>
                <grial:TabItem Text="Fuel Setup">
                    <Grid>
                        <StackLayout Margin="10,10,10,10" HeightRequest="60" Orientation="Horizontal" HorizontalOptions="FillAndExpand">
                            <Stepper Maximum="360" Increment="1" HorizontalOptions="Center" ValueChanged="Stepper_ValueChanged" VerticalOptions="StartAndExpand" />
                            <Label x:Name="lblGallons" Text="Gallons" />
                            <Entry x:Name="txtGallons" WidthRequest="130" />
                        </StackLayout>
                        <StackLayout HorizontalOptions="FillAndExpand" HeightRequest="300">
                            <Editor x:Name="txtNotes" VerticalOptions="Center" />
                        </StackLayout>-->
                    </Grid>
                </grial:TabItem>
            </grial:TabControl>
        </StackLayout>
    </ContentPage.Content>

我是否需要每个视图只有一个堆栈布局,或者其他东西对于获得重叠控件是“有罪的”?

4

2 回答 2

1

如果您只想让您的物品垂直堆叠,只需 aStackLayout而不是 agrid

<StackLayout>
  <StackLayout Margin="10,10,10,10" HeightRequest="60" Orientation="Horizontal" HorizontalOptions="FillAndExpand">
    <Stepper Maximum="360" Increment="1" HorizontalOptions="Center" ValueChanged="Stepper_ValueChanged" VerticalOptions="StartAndExpand" />
    <Label x:Name="lblGallons" Text="Gallons" />
    <Entry x:Name="txtGallons" WidthRequest="130" />
  </StackLayout>
  <StackLayout HorizontalOptions="FillAndExpand" HeightRequest="300">
    <Editor x:Name="txtNotes" VerticalOptions="Center" />
  </StackLayout>-->
</StackLayout>
于 2019-08-13T17:09:03.320 回答
1

如果您想在 Grid 中进行此布局,请尝试以下代码。

<Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="55" ></RowDefinition>
            <RowDefinition Height="55" ></RowDefinition>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="180"></ColumnDefinition>
            <ColumnDefinition Width="50"></ColumnDefinition>
            <ColumnDefinition Width="*"></ColumnDefinition>
        </Grid.ColumnDefinitions>
        <Stepper Grid.Row="0" Grid.Column="0"  Maximum="360" Increment="1" HorizontalOptions="Center" VerticalOptions="StartAndExpand"/>
        <Label Grid.Row="0" Grid.Column="1" x:Name="lblGallons" Text="Gallons" />
        <Entry Grid.Row="0" Grid.Column="2" x:Name="txtGallons" WidthRequest="50" />
        <Editor Grid.Row="1" Grid.Column="0" x:Name="txtNotes" VerticalOptions="Center"></Editor>
    </Grid>

在此处输入图像描述

RowDefinition注意:当你使用 Grid 时,你需要先用and定义行和列ColumnDefinition。然后使用Grid.RowandGrid.Column来指定行和列。

于 2019-08-14T06:03:31.870 回答