适用于Android的Xamarin Forms Project应用程序在不同设备上的显示方式不同

时间:2017-06-12 11:22:37

标签: android xaml xamarin

我是Android dev新手,目前正在编辑现有的Xamarin Forms Project,因为它无法在不同的设备上正确显示。我被告知它应该自动调整大小以适应任何屏幕,但是,调整大小时显示不正确。下面是我的LoginPage.xaml的示例以及菜单的显示方式。包含要填写的表单的主页面也在1列而不是4列上显示不正确。理想情况下,此表单应调整大小以适应设备并允许缩放功能。任何帮助和建议将不胜感激。提前谢谢。

login page image



<?xml version="1.0" encoding="utf-8"?>
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="XCallibre.XForms.Pages.PageLogin" xmlns:controls="clr-namespace:XCallibre.XForms.UserControls;assembly=XCallibre.XForms" xmlns:local="clr-namespace:XCallibre.XForms.ViewModels;assembly=XCallibre.XForms" Title="Login" xmlns:labControls="clr-namespace:XLabs.Forms.Controls;assembly=XLabs.Forms" xmlns:Prog="clr-namespace:XCallibre.XForms;assembly=XCallibre.XForms">
	<Grid VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand">
		<Grid.RowDefinitions>
			<RowDefinition Height="40">
			</RowDefinition>
			<RowDefinition Height="5*">
			</RowDefinition>
			<RowDefinition Height="12*">
			</RowDefinition>
		</Grid.RowDefinitions>
		<Grid.ColumnDefinitions>
			<ColumnDefinition Width="*">
			</ColumnDefinition>
		</Grid.ColumnDefinitions>
		<StackLayout Grid.Row="0" Orientation="Vertical" HorizontalOptions="End" Padding="10,10,10,10">
			<Image x:Name="btnMenu" HorizontalOptions="End" Source="LoginMenu.png">
				<Image.GestureRecognizers>
					<TapGestureRecognizer Command="{Binding ShowMenu}" />
				</Image.GestureRecognizers>
			</Image>
		</StackLayout>
		<AbsoluteLayout Grid.Row="1" Grid.Column="0" x:Name="menuSettings" IsVisible="{Binding ShowMenuList}" HorizontalOptions="End" VerticalOptions="FillAndExpand" Padding="10,0,10,0">
			<StackLayout BackgroundColor="Gray" VerticalOptions="FillAndExpand" Spacing="0" Padding="10,10,10,10">
				<Grid>
					<Grid.RowDefinitions>
						<RowDefinition Height="3*">
						</RowDefinition>
						<RowDefinition Height="12*">
						</RowDefinition>
					</Grid.RowDefinitions>
					<Grid.ColumnDefinitions>
						<ColumnDefinition Width="13*">
						</ColumnDefinition>
						<ColumnDefinition Width="13*">
						</ColumnDefinition>
						<ColumnDefinition Width="3*">
						</ColumnDefinition>
					</Grid.ColumnDefinitions>
					<StackLayout Orientation="Horizontal" Spacing="0" Padding="0,0,0,0" Grid.Row="0" Grid.ColumnSpan="3">
						<Label Text="Options" TextColor="White" FontSize="16" FontAttributes="Bold" HorizontalOptions="CenterAndExpand" VerticalOptions="CenterAndExpand" />
					</StackLayout>
					<StackLayout Orientation="Horizontal" Spacing="0" Grid.Row="0" Grid.Column="2">
						<Image Source="Close.png" HorizontalOptions="End">
							<Image.GestureRecognizers>
								<TapGestureRecognizer Command="{Binding HideMenu}" />
							</Image.GestureRecognizers>
						</Image>
					</StackLayout>
					<StackLayout Orientation="Vertical" Grid.Row="1" BackgroundColor="White" Padding="10,10,0,5" Grid.ColumnSpan="3" HorizontalOptions="FillAndExpand">
						<StackLayout Orientation="Horizontal" Spacing="110">
							<Label Text="Settings" FontAttributes="Bold" FontSize="16">
								<Label.GestureRecognizers>
									<TapGestureRecognizer Command="{Binding ShowSetting}" />
								</Label.GestureRecognizers>
							</Label>
							<Label Text="&gt;" HorizontalOptions="End" FontAttributes="Bold" FontSize="18">
							</Label>
						</StackLayout>
						<Label Text="Help" FontAttributes="Bold" FontSize="16">
							<Label.GestureRecognizers>
								<TapGestureRecognizer Command="{Binding ShowHelpCommand}" />
							</Label.GestureRecognizers>
						</Label>
						<Label Text="About" FontAttributes="Bold" FontSize="16">
							<Label.GestureRecognizers>
								<TapGestureRecognizer Command="{Binding ShowAboutCommand}" />
							</Label.GestureRecognizers>
						</Label>
					</StackLayout>
				</Grid>
			</StackLayout>
		</AbsoluteLayout>
		<AbsoluteLayout Grid.Row="1" Grid.Column="0" x:Name="Settings" IsVisible="{Binding ShowSettingList}" HorizontalOptions="End" VerticalOptions="FillAndExpand" Padding="10,0,10,0">
			<StackLayout BackgroundColor="Gray" VerticalOptions="FillAndExpand" Padding="10,10,10,10">
				<Grid>
					<Grid.RowDefinitions>
						<RowDefinition Height="3*">
						</RowDefinition>
						<RowDefinition Height="12*">
						</RowDefinition>
					</Grid.RowDefinitions>
					<Grid.ColumnDefinitions>
						<ColumnDefinition Width="13*">
						</ColumnDefinition>
						<ColumnDefinition Width="13*">
						</ColumnDefinition>
						<ColumnDefinition Width="3*">
						</ColumnDefinition>
					</Grid.ColumnDefinitions>
					<StackLayout Orientation="Horizontal" Grid.Row="0" Grid.Column="0" HorizontalOptions="StartAndExpand">
						<Label Text="Options" TextColor="White" FontAttributes="Bold" FontSize="16">
							<Label.GestureRecognizers>
								<TapGestureRecognizer Command="{Binding HideSettingList}" />
							</Label.GestureRecognizers>
						</Label>
					</StackLayout>
					<StackLayout Orientation="Horizontal" Grid.Row="0" Grid.Column="1">
						<Label Text="Settings" TextColor="White" FontAttributes="Bold" FontSize="16" />
					</StackLayout>
					<StackLayout Orientation="Horizontal" Grid.Row="0" Grid.Column="2">
						<Image Source="Close.png" HorizontalOptions="End">
							<Image.GestureRecognizers>
								<TapGestureRecognizer Command="{Binding HideMenu}" />
							</Image.GestureRecognizers>
						</Image>
					</StackLayout>
					<StackLayout Orientation="Vertical" BackgroundColor="White" Padding="10,10,0,5" Grid.Row="1" Grid.ColumnSpan="3">
						<StackLayout Orientation="Horizontal" Grid.Row="1" Grid.ColumnSpan="3">
							<Label Text="Server" VerticalOptions="Center" TextColor="Black" FontAttributes="Bold" FontSize="16" />
							<Entry x:Name="ServerUrl" Text="{Binding ServiceURL}" IsEnabled="{Binding IsUrlEnable}" WidthRequest="180" TextColor="Black" />
						</StackLayout>
						<StackLayout Orientation="Horizontal" Grid.Row="1" Grid.ColumnSpan="3">
							<Label Text="Server Connection" VerticalOptions="Center" TextColor="Black" FontAttributes="Bold" FontSize="16" />
							<Switch IsToggled="{Binding IsServerConnection}" />
						</StackLayout>
						<StackLayout Orientation="Horizontal" Grid.Row="1" Grid.ColumnSpan="3" IsVisible="false">
							<Label Text="Auto Send GPS" VerticalOptions="Center" TextColor="Black" FontAttributes="Bold" FontSize="16" />
							<Switch IsToggled="{Binding IsAutoSendGPS}" IsEnabled="{Binding IsAutoSendEnable}" />
						</StackLayout>
					</StackLayout>
				</Grid>
			</StackLayout>
		</AbsoluteLayout>
		<AbsoluteLayout Grid.Row="1" Grid.Column="0" IsVisible="{Binding ShowAbout}" HorizontalOptions="End" VerticalOptions="FillAndExpand" Padding="10,0,10,0">
			<StackLayout BackgroundColor="Gray" VerticalOptions="FillAndExpand" Padding="10,10,10,10">
				<Grid>
					<Grid.RowDefinitions>
						<RowDefinition Height="3*">
						</RowDefinition>
						<RowDefinition Height="12*">
						</RowDefinition>
					</Grid.RowDefinitions>
					<Grid.ColumnDefinitions>
						<ColumnDefinition Width="13*">
						</ColumnDefinition>
						<ColumnDefinition Width="13*">
						</ColumnDefinition>
						<ColumnDefinition Width="3*">
						</ColumnDefinition>
					</Grid.ColumnDefinitions>
					<StackLayout Orientation="Horizontal" Grid.Row="0" Grid.Column="0" HorizontalOptions="StartAndExpand">
						<Label Text="Options" TextColor="White" FontAttributes="Bold" FontSize="16">
							<Label.GestureRecognizers>
								<TapGestureRecognizer Command="{Binding ShowAboutCommand}" />
							</Label.GestureRecognizers>
						</Label>
					</StackLayout>
					<StackLayout Orientation="Horizontal" Grid.Row="0" Grid.Column="1">
						<Label Text="About" TextColor="White" FontAttributes="Bold" FontSize="16" />
					</StackLayout>
					<StackLayout Orientation="Horizontal" Grid.Row="0" Grid.Column="2">
						<Image Source="Close.png" HorizontalOptions="End">
							<Image.GestureRecognizers>
								<TapGestureRecognizer Command="{Binding HideMenu}" />
							</Image.GestureRecognizers>
						</Image>
					</StackLayout>
					<StackLayout Orientation="Vertical" Padding="8,10,5,5" BackgroundColor="White" Grid.Row="1" Grid.ColumnSpan="3">
						<StackLayout Orientation="Horizontal"  Grid.Row="1" Grid.ColumnSpan="3">
							<Label Text="Version" VerticalOptions="Center" TextColor="Black" FontAttributes="Bold" FontSize="16" />
							<Label Text="1.0.0" FontAttributes="Bold" VerticalOptions="Center" FontSize="16"  HorizontalOptions="EndAndExpand" />
						</StackLayout>
						<StackLayout Orientation="Vertical"  Grid.Row="1" Grid.ColumnSpan="3">
							<Label Text="support@xcallibre.com" FontSize="12" HorizontalOptions="StartAndExpand" />
							<Label Text="+27 (0)87 365 3300" FontSize="12" HorizontalOptions="StartAndExpand"  />
							<Label Text="copyright @ 2015 Xcallibre Pty LTD" FontSize="12" HorizontalOptions="StartAndExpand"  />
						</StackLayout>	
					</StackLayout>
                   
				</Grid>
			</StackLayout>
		</AbsoluteLayout>
		<Grid Grid.Row="1" Grid.RowSpan="2" VerticalOptions="Center" HorizontalOptions="Center">
			<Grid.RowDefinitions>
				<RowDefinition Height="1*">
				</RowDefinition>
				<RowDefinition Height="45">
				</RowDefinition>
			</Grid.RowDefinitions>
			<Grid.ColumnDefinitions>
				<ColumnDefinition Width="2*">
				</ColumnDefinition>
				<ColumnDefinition Width="160">
				</ColumnDefinition>
				<ColumnDefinition Width="150">
				</ColumnDefinition>
				<ColumnDefinition Width="160">
				</ColumnDefinition>
				<ColumnDefinition Width="2*">
				</ColumnDefinition>
			</Grid.ColumnDefinitions>
			<StackLayout Grid.Row="0" Grid.Column="1" Grid.ColumnSpan="3" Orientation="Vertical" Padding="0,0,0,25">
				<Entry Placeholder="username" Text="{Binding UserName}" TextColor="#FBF9FB">
				</Entry>
				<Entry Placeholder="password" IsPassword="{Binding IsShowPassword}" Text="{Binding Password}" TextColor="#878784">
				</Entry>
				<StackLayout Orientation="Horizontal">
				<Prog:CustomCheckBox VerticalOptions="Center" Checked="{Binding IsShowPasswordCheckBoxChecked,Mode=TwoWay}" WidthRequest="50">
			    </Prog:CustomCheckBox>
			    <Label Text="Show Password" FontSize="16" TextColor="#878784"/>
			    </StackLayout>
				<Entry Placeholder="serviceURL" Text="{Binding LoginUrl}" IsEnabled="false" TextColor="#878784">
				</Entry>
			</StackLayout>
			<Button Grid.Row="1" Grid.Column="2" x:Name="btnLogin" Text="LOGIN" Command="{Binding LoginCommand}" BackgroundColor="#FDFDFD">
			</Button>
		</Grid>
	</Grid>
</ContentPage>
&#13;
&#13;
&#13;

0 个答案:

没有答案