本文介绍了TitleView不能覆盖整个工具栏的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!
问题描述
我正在使用TitleView
在Toolbar
上开发通知计数.在TitleView
内部,我使用了RelativeLayout
,它是从顶部裁剪,没有显示完整的计数圆圈Label
.
I am developing notification count on Toolbar
using TitleView
. Inside TitleView
I have used RelativeLayout
which is cropping from top side not showing full count circle Label
.
这是我的代码:
<NavigationPage.TitleView>
<RelativeLayout HorizontalOptions="Fill" BackgroundColor="Transparent">
<Image Source="bell.png" HeightRequest="30" WidthRequest="30" x:Name="yellowBoxView"
RelativeLayout.YConstraint="{ConstraintExpression
Type=RelativeToParent,
Property=Height,
Factor=0.018,Constant=0}"
RelativeLayout.XConstraint="{ConstraintExpression
Type=RelativeToParent,
Property=Width,
Factor=0.85,Constant=0}"/>
<Frame
CornerRadius="20"
Padding="-2"
BackgroundColor="White"
HasShadow="False"
RelativeLayout.YConstraint="{ConstraintExpression
Type=RelativeToView,
Property=Y,
ElementName=yellowBoxView,
Factor=1,Constant=-6}"
RelativeLayout.XConstraint="{ConstraintExpression
Type=RelativeToView,
Property=X,
ElementName=yellowBoxView,
Factor=1,Constant=-8}">
<Label FontSize="10" HorizontalTextAlignment="Center" VerticalTextAlignment="Center" BackgroundColor="Transparent" Text="2"
TextColor="Red" HeightRequest="22" WidthRequest="23" x:Name="labelText"/>
</Frame>
</RelativeLayout>
</NavigationPage.TitleView>
这是我的输出:
推荐答案
您可以尝试此解决方案,因为它可能对您有用
<?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="XamarinTest.View.Page3">
<NavigationPage.TitleView >
<StackLayout BackgroundColor="Transparent">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="50" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="100*"/>
</Grid.ColumnDefinitions>
<Image Source="notification.png" Grid.Row="0" Grid.Column="0" HorizontalOptions="End" VerticalOptions="Center" HeightRequest="25" WidthRequest="25"/>
<Frame Grid.Row="0" Grid.Column="0" HorizontalOptions="End" VerticalOptions="Center" Margin="0,-25,10,0" CornerRadius="20"
Padding="-2"
BackgroundColor="White"
HasShadow="False">
<Label FontSize="10" HeightRequest="22" WidthRequest="23" Margin="1,1,1,1" HorizontalTextAlignment="Center" VerticalTextAlignment="Center" BackgroundColor="Transparent" Text="100"
TextColor="Red" x:Name="labelText"/>
</Frame>
</Grid>
</StackLayout>
</NavigationPage.TitleView>
<ContentPage.Content>
<StackLayout >
<Label Text="Hello" />
</StackLayout>
</ContentPage.Content>
</ContentPage>
这篇关于TitleView不能覆盖整个工具栏的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!