按下按钮的XML布局?

时间:2015-10-21 21:06:05

标签: xml xaml xamarin

我正在为我的移动应用在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:local="clr-namespace:Gas_Sense;assembly=Gas_Sense"
             x:Class="Gas_Sense.HomePage"
             Title="Home Page">
  <ContentPage.Padding>
    <OnPlatform x:TypeArguments="Thickness"
                iOS="7, 40, 7, 10" />
  </ContentPage.Padding>
        <Grid>
            <Grid.RowDefinitions>
                  <RowDefinition Height="Auto" />
                  <RowDefinition Height="Auto" />
                  <RowDefinition Height="120" />
                  <RowDefinition Height="Auto" />
                  <RowDefinition Height="Auto" />
                  <RowDefinition Height="Auto" />
                  <RowDefinition Height="*" />
                  <RowDefinition Height="40" />
            </Grid.RowDefinitions>

            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="130" />
                <ColumnDefinition Width="*" />
                <ColumnDefinition Width="auto" />
            </Grid.ColumnDefinitions>

            <Image  Source="Logo.png"
                    HorizontalOptions="Center"
                    VerticalOptions="CenterAndExpand"
                    Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="3" />

            <Image  x:Name="BottleFillImage"
                    Source="bottle_outline.png"
                    VerticalOptions="CenterAndExpand"
                    Grid.Row="2" Grid.Column="0" Grid.RowSpan="6" />

            <Label  Text="Percentage Fill:"
                    HorizontalOptions="Center"
                    VerticalOptions="CenterAndExpand"
                    FontSize="Large"
                    Grid.Row="3" Grid.Column="1" Grid.ColumnSpan="2"/>

           //More labels and Icons

            <Button x:Name="NewDeviceButton" 
                    Image="add.png" 
                    HorizontalOptions="End"
                    VerticalOptions="FillAndExpand"
                    Grid.Row="7" Grid.Column="2" />

            <ActivityIndicator x:Name="ScanActivity" 
                               Color="Black"
                               HorizontalOptions="End"
                               VerticalOptions="FillAndExpand"
                               Grid.Row="7" Grid.Column="2" />
      </Grid>
</ContentPage>

Before button press After button press

0 个答案:

没有答案