英文:
Xamarin Forms NavigationBar has left margin
问题
在导航栏左侧出现小间距的问题可能是由于布局中的某些设置引起的。您可以尝试以下几种方法来解决这个问题：
-
查看导航页的样式或模板是否包含任何左边距或填充。请检查
Builder.xaml文件或相关样式文件，确保没有设置左侧间距或填充。 -
检查
ImageButton的Margin属性是否设置了左边距。在您提供的 XAML 中，ImageButton元素的Margin属性被设置为Margin="0,0,0,0"，这表示没有左边距。但是，如果在代码中有其他设置，可能会影响到左侧间距。 -
检查
RelativeLayout的约束是否正确。在您的 XAML 中，RelativeLayout的约束可能会影响到子元素的位置。请确保相对于父元素的约束没有意外的左偏移。 -
检查
NavigationPage.TitleView的StackLayout是否包含任何不必要的左填充或边距。在您提供的 XAML 中，StackLayout包含Orientation="Horizontal"，请确保它没有设置左填充或边距。
如果上述方法都没有解决问题，您可能需要进一步检查代码中的其他部分，特别是在运行时可能会影响布局的部分。如果问题仍然存在，请提供更多关于问题的上下文或代码的详细信息，以便更好地帮助您解决这个问题。
英文:
I have a problem. I created a TabbedPage like this:
TabbedBuilder = new TabbedPage
{
BarBackgroundColor = Color.FromHex("#212121"),
BarTextColor = Color.White
};
TabbedBuilder.Children.Add(new NavigationPage(new Builder())
{
Title = "Builder",
BarBackgroundColor = Color.FromHex("#212121")
});
TabbedBuilder.Children.Add(new NavigationPage(new TemplateList())
{
Title = "Templates",
BarBackgroundColor = Color.FromHex("#212121")
});
And I call it like this:
Navigation.PushModalAsync(TabbedBuilder);
Now in the TabbedBuilder I have this custom navbar:
<NavigationPage.TitleView>
<StackLayout Orientation="Vertical" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand">
<StackLayout VerticalOptions="CenterAndExpand" Orientation="Horizontal" BackgroundColor="#212121">
<ImageButton Source="Back_Dark.png" HeightRequest="25" WidthRequest="35" HorizontalOptions="Start"
VerticalOptions="Center" BackgroundColor="Transparent" Clicked="btnBack_Clicked"/>
<Image Source="Title_Dark.png" HeightRequest="25" HorizontalOptions="CenterAndExpand" VerticalOptions="Center"/>
</StackLayout>
<StackLayout VerticalOptions="End" HorizontalOptions="FillAndExpand">
<Label HeightRequest="1" BackgroundColor="White" HorizontalOptions="Fill"/>
</StackLayout>
</StackLayout>
</NavigationPage.TitleView>
But there is a small margin on the left side!
How can I remove that?
UPDATE
Here is the full 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:d="http://xamarin.com/schemas/2014/forms/design"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:skia="clr-namespace:SkiaSharp.Views.Forms;assembly=SkiaSharp.Views.Forms"
xmlns:tt="clr-namespace:TouchTracking.Forms;assembly=TouchTracking.Forms"
mc:Ignorable="d"
x:Class="MyApp.Builder"
BackgroundColor="#212121"
Title="Builder">
<NavigationPage.TitleView>
<StackLayout Orientation="Vertical" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand">
<StackLayout VerticalOptions="CenterAndExpand" Orientation="Horizontal" BackgroundColor="#212121">
<ImageButton Source="Back_Dark.png" HeightRequest="25" WidthRequest="35" HorizontalOptions="Start"
VerticalOptions="Center" Margin="0,0,0,0" BackgroundColor="Transparent" Clicked="btnBack_Clicked"/>
<Image Source="Title_Dark.png" HeightRequest="25" HorizontalOptions="CenterAndExpand" VerticalOptions="Center"/>
</StackLayout>
<StackLayout VerticalOptions="End" HorizontalOptions="FillAndExpand">
<Label HeightRequest="1" BackgroundColor="White" HorizontalOptions="Fill"/>
</StackLayout>
</StackLayout>
</NavigationPage.TitleView>
<ContentPage.Content>
<StackLayout>
<RelativeLayout VerticalOptions="FillAndExpand" x:Name="MainLayout">
<StackLayout Orientation="Vertical" VerticalOptions="Center"
RelativeLayout.XConstraint=
"{ConstraintExpression
Type=RelativeToParent,
Property=Width,
Factor=0,
Constant=0
}"
RelativeLayout.YConstraint=
"{ConstraintExpression
Type=RelativeToParent,
Property=Height,
Factor=0.12,
Constant=0}">
<Grid x:Name="GridUpperControl">
<Grid.RowDefinitions>
<RowDefinition Height="50" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="10" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="10" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="10" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="10" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="10" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="10" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="10" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="10" />
</Grid.ColumnDefinitions>
<AbsoluteLayout Grid.Row="1" Grid.ColumnSpan="15" x:Name="CanvasLayout" BackgroundColor="Transparent">
<Grid x:Name="CanvasGrid" VerticalOptions="Center" Grid.Row="1" Grid.ColumnSpan="15">
<skia:SKCanvasView x:Name="Canvas" BackgroundColor="White" VerticalOptions="FillAndExpand"
PaintSurface="OnCanvasViewPaintSurface" />
<Grid.Effects>
<tt:TouchEffect Capture="True"
TouchAction="OnTouchEffectAction" />
</Grid.Effects>
</Grid>
</AbsoluteLayout>
</Grid>
<Grid x:Name="GridBottomControl" VerticalOptions="Center" HorizontalOptions="Center">
<Grid.RowDefinitions>
<RowDefinition Height="60"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="10" />
<ColumnDefinition Width="60" />
<ColumnDefinition Width="5" />
<ColumnDefinition Width="60" />
<ColumnDefinition Width="5" />
<ColumnDefinition Width="60" />
<ColumnDefinition Width="5" />
<ColumnDefinition Width="60" />
<ColumnDefinition Width="5" />
<ColumnDefinition Width="60" />
<ColumnDefinition Width="10" />
</Grid.ColumnDefinitions>
</Grid>
</StackLayout>
<StackLayout Orientation="Horizontal"
RelativeLayout.XConstraint="{ConstraintExpression Type=RelativeToParent,
Property=Width,
Factor=0.95,
Constant=-65}"
RelativeLayout.YConstraint="{ConstraintExpression Type=RelativeToParent,
Property=Height,
Factor=0.95,
Constant=-65}"
VerticalOptions="End">
<ImageButton
Margin="0,0,15,15"
BackgroundColor="Transparent"
HeightRequest="65"
HorizontalOptions="End"
Source="ActionButton_Continue.png"
WidthRequest="65" Clicked="OnContinueClicked" />
</StackLayout>
</RelativeLayout>
</StackLayout>
</ContentPage.Content>
</ContentPage>
I have no idea where I have set a padding/margin that could cause a space in the navigation bar!
答案1
得分: 0
对于 Android，您可以在 MainActivity 中手动调整工具栏。
protected override void OnResume()
{
base.OnResume();
var toolbar = this.FindViewById<Android.Support.V7.Widget.Toolbar>(Resource.Id.toolbar);
if (toolbar != null)
{
toolbar.SetPadding(0, 0, 0, 0);
toolbar.SetContentInsetsAbsolute(0, 0);
}
}
英文:
For Android you can manually tweak the Toolbar in MainActivity.
protected override void OnResume()
{
base.OnResume();
var toolbar = this.FindViewById<Android.Support.V7.Widget.Toolbar>(Resource.Id.toolbar);
if (toolbar != null)
{
toolbar.SetPadding(0, 0, 0, 0);
toolbar.SetContentInsetsAbsolute(0, 0);
}
}
答案2
得分: -1
你在你的XAML中设置了ImageButton的Margin属性
将其更改为：
VerticalOptions="Center" BackgroundColor="Transparent" Clicked="btnBack_Clicked"/>
英文:
You have set Margin in your xaml, on your ImageButton
VerticalOptions="Center" Margin="5,0,0,0" BackgroundColor="Transparent" Clicked="btnBack_Clicked"/>
Change it to:
VerticalOptions="Center" BackgroundColor="Transparent" Clicked="btnBack_Clicked"/>
答案3
得分: -2
在你的堆叠布局中添加负边距，这样它会填充间隙，就像这样：
<StackLayout Margin="-5,0,0,0" Orientation="Vertical" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand">
英文:
Add Margin in your stack layout in negative so it will fill the gap like this
<StackLayout Margin="-5,0,0,0" Orientation="Vertical" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand">
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论