Блог

Я пытаюсь получить свою кнопку с текстом «Я вызываю проблемы» в нижней правой части моей страницы, но она выталкивается с экрана на моем эмуляторе.

Я прочитал документацию 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>
 

Добро пожаловать, Dom. Проблема возникает из-за чрезмерного усложнения вашего xaml / ui. Если бы вы удалили сетку, содержащую вашу кнопку, и просто заменили ее простой кнопкой. Вы можете настроить эту кнопку так, чтобы она соответствовала вашему пользовательскому интерфейсу.

Если вы переместите сетку с кнопкой с помощью одной кнопки, она автоматически станет прямым дочерним элементом StackLayout. Теперь присвоите кнопке высоту 100 и значение HorizontalOptions конца, и вы, вероятно, получите то, что искали, с помощью своей кнопки.

Я добавил изображение и код, чтобы вам было легко воспроизвести. Спасибо за ваш вопрос и удачи в ваших начинаниях в программировании.

И вот ваш код.

 <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>