xamarin 使用带网格的StackLayout将按钮推到屏幕外

dm7nw8vv  于 2023-03-16  发布在  其他
关注(0)|答案(1)|浏览(84)

我试图让我的按钮与文本“我正在造成问题”在我的网页的右下角,但它是被推出屏幕上我的模拟器。
我已经阅读了关于StackLayout的文档,并在StackOverflow上查找了类似的问题,这是我最接近的一次...不幸的是没有成功。
我没有使用任何CSS,我宁愿不使用它,如果不需要。

<ContentPage>//STANDARD CONTENTPAGE STUFF SUCH AS XMLS TAKEN OUT

<ContentPage.ToolbarItems>
    <ToolbarItem Priority="0" Order="Primary" Text="{Binding Inter}" />
</ContentPage.ToolbarItems>

<ContentPage.Content>
    <StackLayout FlexLayout.Grow="1" Margin="10">
        <CollectionView ItemsSource="{Binding Cb}">
            <CollectionView.ItemsLayout>
                <GridItemsLayout
                    Orientation="Vertical"
                    Span="2"
                    VerticalItemSpacing="5" 
                    HorizontalItemSpacing="5"/>
            </CollectionView.ItemsLayout>
            <CollectionView.ItemTemplate>
                <DataTemplate>
                    <Button Text="{Binding Text}" CommandParameter="{Binding CommandParameter}" Command="{Binding Command}" HeightRequest="75" />
                </DataTemplate>
            </CollectionView.ItemTemplate>
        </CollectionView>
        <CollectionView ItemsSource="{Binding Msg}">
            <CollectionView.ItemsLayout>
                <GridItemsLayout
                    Orientation="Vertical"
                    Span="2"
                    VerticalItemSpacing="5" 
                    HorizontalItemSpacing="5"/>
            </CollectionView.ItemsLayout>
            <CollectionView.ItemTemplate>
                <DataTemplate>
                    <Label Text="{Binding .}" />
                </DataTemplate>
            </CollectionView.ItemTemplate>
        </CollectionView>
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="80*"></ColumnDefinition>
                <ColumnDefinition Width="20*"></ColumnDefinition>
            </Grid.ColumnDefinitions>
            <StackLayout Grid.Row="0" Grid.Column="1" HorizontalOptions="Center">
                <ButtonText="I am causing problems!"></Button>
            </StackLayout>
        </Grid>
    </StackLayout>
</ContentPage.Content>
aelbi1ox

aelbi1ox1#

欢迎使用Dom。这个问题源于xaml/ui过于复杂。如果您要删除包含按钮的网格,并将其替换为普通按钮。然后您可以根据需要设置该按钮的样式以适合您的UI。
如果你将Grid-with-button替换为一个按钮,那么它会自动成为StackLayout的直接子项。现在将Button的Height设置为100,HorizontalOptions设置为End,你可能会得到你想要的按钮。
我已经添加了一个图像和代码,所以它很容易为您复制。感谢您的问题,并祝您好运与您的编程努力。

这是你的密码。

<StackLayout FlexLayout.Grow="1" Margin="10">
        <CollectionView ItemsSource="{Binding Cb}">
            <CollectionView.ItemsLayout>
                <GridItemsLayout
                    Orientation="Vertical"
                    Span="2"
                    VerticalItemSpacing="5" 
                    HorizontalItemSpacing="5"/>
            </CollectionView.ItemsLayout>
            <CollectionView.ItemTemplate>
                <DataTemplate>
                    <Button Text="{Binding Text}" 
                            CommandParameter="{Binding CommandParameter}" 
                            Command="{Binding Command}" 
                            HeightRequest="75" />
                </DataTemplate>
            </CollectionView.ItemTemplate>
        </CollectionView>
        <CollectionView ItemsSource="{Binding Msg}">
            <CollectionView.ItemsLayout>
                <GridItemsLayout
                    Orientation="Vertical"
                    Span="2"
                    VerticalItemSpacing="5" 
                    HorizontalItemSpacing="5"/>
            </CollectionView.ItemsLayout>
            <CollectionView.ItemTemplate>
                <DataTemplate>
                    <Label Text="{Binding .}" />
                </DataTemplate>
            </CollectionView.ItemTemplate>
        </CollectionView>
        <Button Text="test knop met text" HeightRequest="100" 
                HorizontalOptions="End"/>
</StackLayout>

相关问题