c# – 相对布局中的布局项(XAML)

2019年8月6日 246次阅读

我想要一个水平居中的图像,然后是一个位于其下方的文本框,也是水平居中的.

从我看到的所有示例中,需要先了解相对视图的宽度和高度,然后才能对其进行硬编码.当然不是这样的吗？

这是我到目前为止所尝试的.

        <RelativeLayout>
        <Image x:Name="logo" Source="logo.png" HorizontalOptions="CenterAndExpand"/>

        <StackLayout Orientation="Horizontal"
            BackgroundColor="Lime"
            RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent, 
                                    Property=Width,
                                    Factor=0.5"
            RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToView, 
                                    ElementName=logo
                                    Property=Y,
                                    Constant=100}">
            <Entry Text="{Binding Email, Mode=TwoWay}" Keyboard="Email" x:Name="signUpemailEntry" Placeholder="Email" TextColor="#2980b9" WidthRequest="270"  BackgroundColor="Fuchsia">
                <Entry.Behaviors>
                    <behave:EmailValidatorBehaviour x:Name="signUpemailValidator"/>
                 </Entry.Behaviors>
            </Entry>

            <Image x:Name="signUpemailSuccessErrorImage"
                  Style="{Binding Source={x:Reference emailValidator}, 
                          Path=IsValid, 
                          Converter={StaticResource boolToStyleImage}}"/>
       </StackLayout>
    </RelativeLayout>

最佳答案 不确定这是否是您需要的,但为了实现您的目标,您需要将图像和文本放在RelativeLayout内的相同StackLayout中.

<?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="TestRelativeLayout.MyPage">
    <ContentPage.Content>
           <RelativeLayout>
        <StackLayout Orientation="Vertical">
            <Image x:Name="logo" Source="postage1.jpg" HorizontalOptions="Center"/>
            <Entry Text="Test" Keyboard="Email" x:Name="signUpemailEntry"
            Placeholder="Email" TextColor="#2980b9" WidthRequest="270"
            BackgroundColor="Fuchsia"
            HorizontalOptions="Center"/>
       </StackLayout>
    </RelativeLayout>
    </ContentPage.Content>
</ContentPage>
点赞