首页 文章

Xamarin表单 - 制作按钮出现在页面底部

提问于
浏览
6

我正在玩一个Xamarin表单试图让一个按钮出现在页面底部 . 这是我的xaml ......

<?xml version="1.0" encoding="utf-8" ?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms"
             xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
             xmlns:control="clr-namespace:RMG.InView.Device.Shared;assembly=RMG.InView.Device"
             x:Class="RMG.InView.Device.Shared.PinCodeControlDemoPage">
  <StackLayout>
    <Label Text="Enter A Code" VerticalOptions="Center" HorizontalOptions="Center" />
    <Button Text="Reveal Code" x:Name="RevealCode" Clicked="RevealCode_OnClicked" VerticalOptions="End" ></Button>
  </StackLayout>
</ContentPage>

我将VerticalOptions设置为End,但按钮出现在屏幕中间 .

enter image description here

如何使按钮粘在屏幕底部?

4 回答

  • 1

    这对我有用 .

    <StackLayout BackgroundColor="#2D3033"> 
                    <Button Clicked ="Button_Clicked"
                                Text="Login"  
                                BackgroundColor="#007F00"
                                BorderColor="#004C00"
                                BorderWidth="1"
                                TextColor="white"
                            HorizontalOptions="CenterAndExpand"
                            VerticalOptions="EndAndExpand"
                        />
            </StackLayout>
    
  • 0

    使用 Grid 很简单就这样做:

    <?xml version="1.0" encoding="utf-8"?>
    <ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:local="clr-namespace:shared_forms" x:Class="shared_forms.shared_formsPage">
        <Grid>
            <Label Text="Enter A Code" VerticalOptions="Center" HorizontalOptions="Center" />
            <Button Text="Reveal Code" x:Name="RevealCode" HorizontalOptions="CenterAndExpand" VerticalOptions="End" />
        </Grid>
    </ContentPage>
    

    使用 StackLayout

    <?xml version="1.0" encoding="utf-8"?>
    <ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" xmlns:local="clr-namespace:shared_forms" x:Class="shared_forms.shared_formsPage">
        <StackLayout VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand">
            <StackLayout Orientation="Horizontal" VerticalOptions="Start">
                <!-- top controls -->
                <Label Text="Enter A Code" VerticalOptions="Center" HorizontalOptions="CenterAndExpand" />
            </StackLayout>
            <StackLayout VerticalOptions="CenterAndExpand">
                <!-- middle controls -->
            </StackLayout>
            <StackLayout Orientation="Horizontal" VerticalOptions="End">
                <!-- bottom controls -->
                <Button Text="Reveal Code" x:Name="RevealCode" HorizontalOptions="CenterAndExpand" />
            </StackLayout>
        </StackLayout>
    </ContentPage>
    

    结果:

    enter image description here

  • 14

    试试这个代码背后:

    Label EnterACodeLabel = new Label { Text = "Enter A code " };
          Button RevealCodeButton= new Button { Text = "Reveal Code" };
          StackLayout RevealButtonStackLayout = new StackLayout
                    {
                        VerticalOptions = LayoutOptions.End,
                        Children =
                        {
                            RevealCodeButton,
                               //put all controls want to be on button 
                        }
                    };
    
                    StackLayout AllContentExceptRevelCodeButton = new StackLayout
                    {
                        Padding = new Thickness(5),
                        Children =
                        {
                           EnterACodeLabel ,
                          //put all controls need to be on the top 
                        }
                    };
    
                    StackLayout AllPageContent = new StackLayout
                    {
                        VerticalOptions = LayoutOptions.FillAndExpand,
                        HorizontalOptions = LayoutOptions.FillAndExpand,
                        Children =
                        {
                            AllContentExceptRevelCodeButton,
                            RevealButtonStackLayout
                        }
                    };
    
                    Content = AllPageContent;
    
  • 0
    <ContentPage.Content>
        <Grid>
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto" />
                <RowDefinition Height="*" />
            </Grid.RowDefinitions>
    
            <StackLayout Grid.Row="0">
            </StackLayout>
    
            <StackLayout Grid.Row="1" VerticalOptions="End">
                <controls:STButton Text="Yeni Görev Ekle" />
            </StackLayout>
       </Grid>
    </ContentPage.Content>
    

    %100工作;)

相关问题