首页 > 解决方案 > Xamarin 布局 XAML

问题描述

我目前正在使用 Xamarin 为 IOS 和 Android 构建一个应用程序,它应该是一个转换器应用程序,可以将十进制转换为二进制、十六进制和八进制等价物。该应用程序应该以特定方式格式化,我对 XAML 很陌生. 我希望标签在屏幕上居中,并且所有内容都很好地间隔开,但是我现在这样做的方式让它看起来很乱。下面是我的 XAML。我可以利用 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:Assignment2"
             x:Class="Assignment2.MainPage">

    <StackLayout Orientation="Vertical" Padding="20">
        <StackLayout Orientation="Horizontal">
            <StackLayout Orientation="Horizontal">
                <Label Text="Number Converter" HorizontalOptions="Center"/>
            </StackLayout>
            <Label Text="Decimal" VerticalOptions="End" />

            <Entry x:Name="Decimal" WidthRequest="75" HorizontalOptions="Center" />
        </StackLayout>

        <BoxView x:Name ="Space" HeightRequest="30"/>

        <Button Clicked="Button_Clicked" x:Name="converter" Text="Convert" />

        <StackLayout Orientation="Horizontal">

            <Label Text="Octal" VerticalOptions="Center" />

            <Label x:Name="Octal" VerticalOptions="Center" WidthRequest="100" />
            <Label Text="Hexadecimal" VerticalOptions="Center"/>

            <Label x:Name="Hexa" VerticalOptions="Center" WidthRequest="50" />
        </StackLayout>
        <StackLayout Orientation="Horizontal">
            <Label Text="Binary Bytes 1-4" VerticalOptions="Center" HorizontalOptions="CenterAndExpand"/>
        </StackLayout>
        <StackLayout>
            <BoxView x:Name="Extra" HeightRequest="30"/>
            <Label x:Name="First" VerticalOptions="Center"/>
            <Label x:Name="Second" VerticalOptions="Center"/>
            <Label x:Name="Third" VerticalOptions="Center"/>
            <Label x:Name="Forth" VerticalOptions="Center"/>
        </StackLayout>
    </StackLayout>

</ContentPage>

手机屏幕

标签: c#visual-studioxamlxamarin

解决方案


这个问题太笼统了。我建议您阅读有关可用布局的文档。然后,您可以查看每种布局类型的文档以了解如何使用它们。

概述:https ://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/controls/layouts

滚动视图: https : //docs.microsoft.com/en-us/dotnet/api/xamarin.forms.scrollview?view=xamarin-forms 堆栈布局:https ://docs.microsoft.com/en-us/dotnet/api /xamarin.forms.stacklayout?view=xamarin-forms 网格:https ://docs.microsoft.com/en-us/dotnet/api/xamarin.forms.grid?view=xamarin-forms AbsoluteLayout:https://docs .microsoft.com/en-us/dotnet/api/xamarin.forms.absolutelayout?view=xamarin-forms RelativeLayout(性能昂贵,小心使用):https ://docs.microsoft.com/en-us/dotnet /api/xamarin.forms.relativelayout?view=xamarin-forms FlexLayout:https ://docs.microsoft.com/en-us/dotnet/api/xamarin.forms.flexlayout?view=xamarin-forms


推荐阅读