分类导航

程序问答发布时间：2022-06-02 发布网站：大佬教程 code.js-code.com

大佬教程收集整理的这篇文章主要介绍了如何在 Xamarin Form 中设置控件以在每个手机屏幕尺寸中获得相似且相对的 UI？，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。

如何解决如何在 Xamarin Form 中设置控件以在每个手机屏幕尺寸中获得相似且相对的 UI？？

开发过程中遇到如何在 Xamarin Form 中设置控件以在每个手机屏幕尺寸中获得相似且相对的 UI？的问题如何解决？下面主要结合日常开发的经验，给出你关于如何在 Xamarin Form 中设置控件以在每个手机屏幕尺寸中获得相似且相对的 UI？的解决方法建议，希望对你解决如何在 Xamarin Form 中设置控件以在每个手机屏幕尺寸中获得相似且相对的 UI？有所启发或帮助；

我想制作这样的用户界面：

如何在 Xamarin Form 中设置控件以在每个手机屏幕尺寸中获得相似且相对的 UI？

这个 UI 应该对应不同的手机屏幕尺寸。我开始写这个 XAML 代码：

 <StackLayout>
        <GrID>
            <GrID.RowDeFinitions>
                <RowDeFinition Height="*"/>
                <RowDeFinition Height="*"/>
            </GrID.RowDeFinitions>
            <Frame BACkgroundcolor="transparent"/>
        </GrID>
        <GrID margin="20">
            <GrID.RowDeFinitions>
                <RowDeFinition Height="*"/>
                <RowDeFinition Height="auto"/>
            </GrID.RowDeFinitions>
            <GrID GrID.Row="0">
                <Frame Heightrequest="30" BACkgroundcolor="White" CornerRadius="10"/>
            </GrID>
            <GrID GrID.Row="1" padding="0,40,0">
                <Frame Heightrequest="30" BACkgroundcolor="White" CornerRadius="10"/>
            </GrID>
        </GrID>
        <Entry GrID.Row="0" GrID.column="1" MaxLength="30" Placeholder="User name:" ClearbuttonVisibility="WhileEdiTing"/>
        <Entry GrID.Row="1" GrID.column="1" MaxLength="30" Placeholder="password:" ClearbuttonVisibility="WhileEdiTing" Ispassword="True"/>
    <Image source="User.png" Scale="0.6"/>
    <Image source="Lock.png" Scale="0.6"/>
    <button Text="Login"/>
</StackLayout>

我知道那些图像必须在上面的网格节点中。但是我无法正确设置这些 Entry 和 user/pass 徽标。这些按钮是资源文件夹中的图像。请帮我设置一个类似于此图片的 UI。

解决方法

一个格子就够了，你可以去掉一个。可以参考如下代码：

<StackLayout BACkgroundColor="#1E90FF" Orientation="Vertical">

    <Grid Margin="20" >
        <Grid.RowDefinitions>
            <RowDefinition Height="*"/>
            <RowDefinition Height="Auto"/>
        </Grid.RowDefinitions>

        <Grid.columnDefinitions>
            <columnDefinition Width="*"/>
            <columnDefinition Width="Auto"/>
        </Grid.columnDefinitions>
        <Frame Heightrequest="30" BACkgroundColor="White" CornerRadius="10" Grid.Row="0" Grid.columnSpan="2" />

        <Entry Grid.Row="0" Grid.column="0" MaxLength="30" Placeholder="User Name:" ClearButtonVisibility="WhileEdiTing"  />

        <Image source="head.png" Scale="0.6" Grid.Row="0" Grid.column="1"/>
        <Frame Heightrequest="30" BACkgroundColor="White" CornerRadius="10" Grid.Row="1" Grid.columnSpan="2"/>

        <Entry Grid.Row="1" Grid.column="0" MaxLength="30" Placeholder="password:" ClearButtonVisibility="WhileEdiTing" Ispassword="True"/>
        <Image source="Lock.png" Scale="0.6" Grid.Row="1" Grid.column="1"/>
    </Grid>

    <Button Text="Login"/>
</StackLayout>