Xamarin.Forms登录页用户代码与密码输入框间多余空白问题
解决DevExpress输入框间空白问题
要消除用户代码(Kullanıcı kodu)和密码(Şifre)输入框之间的空白,你需要调整两个关键设置——这也是你之前修改Margin、行高没解决问题的核心原因:
1. 关闭错误提示预留行
你的TextEdit和PasswordEdit都设置了ReserveBottomTextLine="True",这个属性会强制预留一行空间用来显示错误提示——哪怕当前没有错误,这部分空白也会一直存在,直接导致输入框下方多出不必要的间距。
把这个属性删掉或者改成False即可:
<!-- 移除ReserveBottomTextLine属性,或者设置为False --> <dxe:TextEdit x:Name="loginCustomEntryKullanici" ... <!-- ReserveBottomTextLine="True" --> ... /> <dxe:PasswordEdit x:Name="loginCustomEntryPass" ... <!-- ReserveBottomTextLine="True" --> ... />
2. 优化Grid行高与控件高度设置
你同时给Grid行和控件设置了固定高度,容易导致布局计算冲突。可以把Grid行高改成Auto,让它自动适应控件内容,同时把控件的HeightRequest调整为更紧凑的值(比如60,和上方的ComboBox保持一致):
修改Grid行定义:
<Grid.RowDefinitions> <RowDefinition Height="60" /> <RowDefinition Height="Auto" /> <!-- 自动适配TextEdit高度 --> <RowDefinition Height="Auto"/> <!-- 自动适配PasswordEdit高度 --> </Grid.RowDefinitions>
调整控件HeightRequest:
<dxe:TextEdit ... HeightRequest="60" VerticalOptions="Start" <!-- 替换FillAndExpand,避免控件过度拉伸 --> ... /> <dxe:PasswordEdit ... HeightRequest="60" VerticalOptions="Start" ... />
最终修改后的完整XAML
<ContentPage.Content> <StackLayout VerticalOptions="Center" HorizontalOptions="CenterAndExpand" Margin="15" Padding="5"> <Image Source="@drawable/ida_logo" /> <Label x:Name="denemeText" Text="Çözüm Ortağınız" FontSize="Title" TextColor="Black" FontFamily = "LobsterTwoItalic" xct:ShadowEffect.Color="SlateGray" xct:ShadowEffect.Opacity="0.8" VerticalOptions="CenterAndExpand" HorizontalOptions="CenterAndExpand" /> <Grid> <Grid.RowDefinitions> <RowDefinition Height="60" /> <RowDefinition Height="Auto" /> <RowDefinition Height="Auto"/> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition /> </Grid.ColumnDefinitions> <dxe:ComboBoxEdit x:Name="databasePicker" BackgroundColor="White" LabelText="Veritabanı" Grid.Row="0" Grid.Column="0" LabelColor="Black" TextFontSize="18" LabelFontSize="18" DropDownItemFontSize="18" BottomTextFontSize="18" AffixFontSize="18" HorizontalOptions="FillAndExpand" BorderColor="Black" BorderThickness="1" TextFontFamily="Roboto" AffixFontFamily="Roboto" BottomTextFontFamily="Roboto" DropDownItemFontFamily="Roboto" DropDownItemTextColor="Black" DropDownSelectedItemTextColor="Black" TextHorizontalAlignment="Center" VerticalOptions="FillAndExpand" HeightRequest="60" TextColor="Black" /> <dxe:TextEdit x:Name="loginCustomEntryKullanici" LabelText="Kullanıcı Kodu" TextFontSize="18" LabelFontSize="18" BottomTextFontSize="18" AffixFontSize="18" LabelColor="Black" BackgroundColor="White" BorderColor="Black" AutofillContentType="None" IsLabelFloating="True" AffixFontFamily="Roboto" BottomTextFontFamily="Roboto" TextFontFamily="Roboto" Grid.Row="1" Grid.Column="0" HeightRequest="60" VerticalOptions="Start" /> <dxe:PasswordEdit x:Name="loginCustomEntryPass" LabelText="Şifre" TextFontSize="18" LabelFontSize="18" BottomTextFontSize="18" LabelColor="Black" BackgroundColor="White" BorderColor="Black" IsLabelFloating="True" BottomTextFontFamily="Roboto" TextFontFamily="Roboto" Grid.Row="2" Grid.Column="0" VerticalOptions="Start" HeightRequest="60" /> </Grid> <Button x:Name="giris_Button" Text="Giriş Yap" TextColor="Black" FontSize="Medium" Clicked="giris_Button_Clicked1" VerticalOptions="Center" BackgroundColor="Transparent" BorderColor="Black" BorderWidth="1" CornerRadius="8" xct:TouchEffect.AnimationDuration="250" xct:TouchEffect.AnimationEasing="{x:Static Easing.CubicInOut}" xct:TouchEffect.PressedScale="1.25" xct:TouchEffect.PressedBackgroundColor="AliceBlue" xct:TouchEffect.NormalBackgroundColor="Transparent" /> </StackLayout> </ContentPage.Content>
额外提醒
如果之后需要显示错误提示,可以通过代码动态开启ReserveBottomTextLine="True"并绑定错误文本,这样只有在有错误时才会占用那行空间。另外,也可以给控件显式设置Margin="0"和Padding="0",彻底清除DevExpress控件自带的默认间距。
内容的提问来源于stack exchange,提问作者Mert Altiparmak
相关产品推荐
相关产品推荐

