Xamarin.Forms通用应用程序2列布局独立于设备大小

我很新，Xamarin.Forms创建通用应用程序。其实我必须将一个大的原生应用程序迁移到Xamarin.Forms技术。Xamarin.Forms通用应用程序2列布局独立于设备大小

我必须创建一个独立于设备大小的双列布局（例如注册页面）。

我想使用RelativeLayout实现相同。代码同样是下面：

<?xml version="1.0" encoding="UTF-8"?> 
<ContentPage BackgroundColor="Yellow" xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="LearningXamarin.Views.TestPage"> 
    <ContentPage.Content> 
     <RelativeLayout> 
      <StackLayout x:Name="mainLayout" BackgroundColor="Maroon" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand" 
       RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=1, Constant=0}" 
       RelativeLayout.HeightConstraint="{ConstraintExpression Type=RelativeToParent, Property=Height, Factor=1, Constant=0}"> 
       <RelativeLayout> 
        <BoxView x:Name="firstView" BackgroundColor="Yellow" HeightRequest="30" 
         RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, Property=X, Factor=0, Constant=5}" 
         RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent, Property=Y, Factor=0, Constant=20}" 
         RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToParent, Property=Width, Factor=0.48, Constant=0}" 
        /> 
        <BoxView BackgroundColor="Green" HeightRequest="30" 
         RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToView, ElementName=firstView, Property=Width, Factor=1, Constant=10}" 
         RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToView, ElementName=firstView, Property=Y, Factor=1, Constant=0}" 
         RelativeLayout.WidthConstraint="{ConstraintExpression Type=RelativeToView, ElementName=firstView, Property=Width, Factor=1, Constant=0}" 
        /> 
       </RelativeLayout> 

      </StackLayout> 
     </RelativeLayout> 
    </ContentPage.Content> 
</ContentPage>

请建议是这样的正确的方式实现两个布局或有任何其他正确的方式。

来源

2017-05-28 Tisha Anand

我想尝试网格与两列，而不是 – Jason

使用网格。网格可以根据需要具有尽可能多的列或行，并且可以根据其内容或可用空间调整它们的大小。在你的情况下，你可以有一个带有两个星形大小的列的网格 - 这就给出了两列宽度相等的列来填充可用空间，实际上是两列，每一列都是屏幕宽度的一半。

<?xml version="1.0" encoding="UTF-8"?> 
<ContentPage BackgroundColor="Yellow" xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="LearningXamarin.Views.TestPage"> 
    <ContentPage.Content> 
     <Grid BackgroundColor="Maroon"> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="*"/> 
       <ColumnDefinition Width="*"/> 
      </Grid.ColumnDefinitions> 
      <BoxView Grid.Column="0" x:Name="firstView" BackgroundColor="Yellow" HeightRequest="30"/> 
      <BoxView Grid.Column="1" BackgroundColor="Green" HeightRequest="30"/> 
     </Grid> 
    </ContentPage.Content> 
</ContentPage>

您可以了解不同的网格大小在这里：

来源

2017-05-28 22:58:58 JimBobBennett

Xamarin.Forms通用应用程序2列布局独立于设备大小

回答

相关问题