如何在带有TabbedPage的导航栏中添加徽章计数在Xamarin表单中？
我想在带有徽章计数的购物车图标中添加导航栏。 我使用工具栏项在导航栏中添加了购物车图标。并使用插件创建徽章计数圆圈视图。如果我给保证金将徽章图标设置为工具栏项，则它会隐藏在标签页后面。
它没有显示在购物车图标上。
请帮我解决这个问题。
如上图所示，我想用标签页设置徽章数。
以下是我的XAML代码。
<?xml version="1.0" encoding="utf-8" ?>
<TabbedPage xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:lang="clr-namespace:Conekto"
xmlns:controls="clr-namespace:Conekto.Controls;"
x:Class="ProjectName.Pages.SalePage">
<TabbedPage.Children>
<ContentPage Title="{lang:Translate PRODUCTLIST}">
<Grid Margin="10,10,10,0" BackgroundColor="White">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="50" />
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Button Grid.Row="0" Grid.Column="0" Text="charge 15,123" Style="{StaticResource primaryButton}" />
<SearchBar x:Name="txtSearch" Grid.Row="1" Grid.Column="0" TextChanged="MySearchBarOnTextChanged" Placeholder="{lang:Translate Search}" SearchCommand="{Binding SearchCommand, Mode=TwoWay}" CancelButtonColor="Blue" Text="{Binding SearchText, Mode=TwoWay}" Style="{StaticResource labelgreycolour}" WidthRequest="50" HorizontalOptions="FillAndExpand"
VerticalOptions="FillAndExpand" />
<StackLayout Grid.Row="2" Grid.Column="0" VerticalOptions="StartAndExpand" HorizontalOptions="FillAndExpand">
<ListView x:Name="listView" ItemsSource="{Binding ProductList}" HasUnevenRows="True" IsPullToRefreshEnabled="true" RefreshCommand="{Binding RefreshCommand}" IsRefreshing="{Binding IsRefreshing}" ItemAppearing="listView_ItemAppearing" ItemSelected="listView_ItemSelected" SelectedItem="{Binding listView_ItemSelected, Mode=TwoWay}" BackgroundColor="White" HorizontalOptions="FillAndExpand">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<Grid Margin="0,5,0,5">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="10*" />
<ColumnDefinition Width="50*" />
<ColumnDefinition Width="40*" />
</Grid.ColumnDefinitions>
<Image Source="add" Grid.Row="0" Grid.Column="0" Grid.RowSpan="2" Aspect="AspectFit" HeightRequest="30" WidthRequest="30" VerticalOptions="CenterAndExpand" HorizontalOptions="CenterAndExpand">
<Image.GestureRecognizers>
<TapGestureRecognizer Command="{Binding BindingContext.AddProductCommand, Source={x:Reference listView}}" CommandParameter="{Binding .}" NumberOfTapsRequired="1" />
</Image.GestureRecognizers>
</Image>
<Label Grid.Row="0" Grid.Column="1" VerticalOptions="CenterAndExpand" VerticalTextAlignment="End" Text="{Binding ProductName,Mode=TwoWay}" Style="{StaticResource entrylogin}" />
<Label Grid.Row="1" Grid.Column="1" VerticalOptions="CenterAndExpand" VerticalTextAlignment="End" Text="{Binding Cost,Mode=TwoWay,StringFormat='XOF {0}'}" Style="{StaticResource listViewsublabel}" />
</Grid>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</StackLayout>
</Grid>
<controls:FloatingActionButton Margin="0,0,20,20" Grid.Row="0" x:Name="FABCart" HorizontalOptions="End" VerticalOptions="End" WidthRequest="60" HeightRequest="60" Image="cart" ButtonColor="#09999A" Clicked="FabCart_Clicked" />
<controls:BadgeView Margin="0,0,32,52" Grid.Row="0" Text="{Binding TotalCartItem, Mode=TwoWay}" BadgeColor="White" HorizontalOptions="End" VerticalOptions="End" />
</Grid>
</ContentPage>
<ContentPage Title="{lang:Translate KEYPAD}">
<ContentPage.BackgroundColor>
<OnPlatform x:TypeArguments="Color">
<OnPlatform.Platforms>
<On Platform="iOS" Value="Black" />
<On Platform="Android" Value="#eee" />
</OnPlatform.Platforms>
</OnPlatform>
</ContentPage.BackgroundColor>
<Grid x:Name="controlGrid" Margin="0,0,0,0" Padding="0,0,0,0" VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand">
<Grid.ColumnSpacing>
<OnPlatform x:TypeArguments="x:Double">
<OnPlatform.Platforms>
<On Platform="iOS" Value="1" />
<On Platform="Android" Value="0" />
</OnPlatform.Platforms>
</OnPlatform>
</Grid.ColumnSpacing>
<Grid.RowSpacing>
<OnPlatform x:TypeArguments="x:Double">
<OnPlatform.Platforms>
<On Platform="iOS" Value="1" />
<On Platform="Android" Value="0" />
</OnPlatform.Platforms>
</OnPlatform>
</Grid.RowSpacing>
<Grid.RowDefinitions>
<RowDefinition Height="74" />
<RowDefinition Height="80" />
<RowDefinition Height="*" />
<RowDefinition Height="*" />
<RowDefinition Height="*" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Button Text="charge 15,123" Margin="12,12,12,12" Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="3" Style="{StaticResource primaryButton}" />
<Label Text="Add note" FontSize="10" Grid.Column="0" Grid.Row="1" HorizontalTextAlignment="Center" VerticalTextAlignment="End" TextColor="Black" />
<Label x:Name="lblVal" Margin="0,0,16,0" Grid.Row="1" Grid.Column="1" HorizontalTextAlignment="End" VerticalTextAlignment="Center" TextColor="Black" FontSize="30" Grid.ColumnSpan="2" VerticalOptions="End" />
<Button Clicked="Button_Clicked" Text ="7" Grid.Row="2" Grid.Column="0" Style="{StaticResource plainButton}" />
<Button Clicked="Button_Clicked" Text = "8" Grid.Row="2" Grid.Column="1" Style="{StaticResource plainButton}" />
<Button Clicked="Button_Clicked" Text = "9" Grid.Row="2" Grid.Column="2" Style="{StaticResource plainButton}" />
<Button Clicked="Button_Clicked" Text = "4" Grid.Row="3" Grid.Column="0" Style="{StaticResource plainButton}" />
<Button Clicked="Button_Clicked" Text = "5" Grid.Row="3" Grid.Column="1" Style="{StaticResource plainButton}" />
<Button Clicked="Button_Clicked" Text = "6" Grid.Row="3" Grid.Column="2" Style="{StaticResource plainButton}" />
<Button Clicked="Button_Clicked" Text = "1" Grid.Row="4" Grid.Column="0" Style="{StaticResource plainButton}" />
<Button Clicked="Button_Clicked" Text = "2" Grid.Row="4" Grid.Column="1" Style="{StaticResource plainButton}" />
<Button Clicked="Button_Clicked" Text = "3" Grid.Row="4" Grid.Column="2" Style="{StaticResource plainButton}" />
<Button Clicked="ButtonClear_Clicked" Text = "C" Grid.Row="5" Grid.Column="0" Style="{StaticResource plainButton}" />
<Button Clicked="Button_Clicked" Text = "0" Grid.Row="5" Grid.Column="1" Style="{StaticResource plainButton}" />
<Button Clicked="Button_Clicked" Text = "+" Grid.Row="5" Grid.Column="2" Style="{StaticResource plainButton}" />
</Grid>
</ContentPage>
<ContentPage Title="{lang:Translate SCAN}">
</ContentPage>
</TabbedPage.Children>
在.cs页面代码中，我在工具栏项目中添加了购物车图标。
ToolbarItems.Add(new ToolbarItem("Add Product", "floating", async () =>
{
//var page = new ContentPage();
//var result = await page.DisplayAlert("Title", "Message", "Accept", "Cancel");
await Navigation.PushAsync(new CreateProductPage() { Title = Helper.GetResxNameByValue("CreateProduct") });
//Debug.WriteLine("success: {0}", result);
}));
根据设计我添加了购物车按钮作为浮动按钮。请不要考虑这一点。
2 个答案:
答案 0 :(得分：2)
要在工具栏项上添加徽章，您可以使用NavigationPage.SetHasNavigationBar(this, false);隐藏默认工具栏，然后可以使用带有徽章计数器和汉堡包的按钮创建自己的工具栏，以显示和隐藏侧面菜单。
单击汉堡包按钮的页面：
private void Button_Clicked(object sender, System.EventArgs e)
{
MessagingCenter.Send(this, "presnt");
}
在MasterDetail页面上：
MessagingCenter.Subscribe<YourPage>(this, "presnt", (sender) =>
{
IsPresented = true;
});
此外，在制作IsPresented=true之前，还没有检查滑动菜单。
您可以检查https://github.com/LeslieCorrea/Xamarin-Forms-Shopping-Cart此链接以获取更多信息。但是通过在android中使用此方法，导航栏可能会显示在标签页下方，因此您可能需要使用按钮创建标签页。
答案 1 :(得分：0)
<NavigationPage.TitleView>
<StackLayout Orientation="Horizontal">
<Label FontAttributes="Bold" TextColor="Black" FontSize="Medium" Text="Female Category" VerticalOptions="CenterAndExpand" HorizontalOptions="CenterAndExpand"></Label>
<AbsoluteLayout Margin="0,0,5,0" HorizontalOptions="EndAndExpand">
<Frame BackgroundColor="White" BorderColor="Black" CornerRadius="50" WidthRequest="40"
Padding="0"
Margin="0,10,0,10">
<ImageButton Source="add_to_basket.png" BackgroundColor="Transparent" Clicked="ImageButton_Clicked" Padding="5"/>
</Frame>
<Frame BackgroundColor="Red" HeightRequest="30" BorderColor="Black" WidthRequest="20" CornerRadius="50" Padding="0,0,0,-10" Margin="25,5,0,0">
<Label HorizontalOptions="CenterAndExpand" Text="53" TextColor="White" />
</Frame>
</AbsoluteLayout>
</StackLayout>
</NavigationPage.TitleView>
相关问题
最新问题
- 我写了这段代码，但我无法理解我的错误
- 我无法从一个代码实例的列表中删除 None 值，但我可以在另一个实例中。为什么它适用于一个细分市场而不适用于另一个细分市场？
- 是否有可能使 loadstring 不可能等于打印？卢阿
- java中的random.expovariate()
- Appscript 通过会议在 Google 日历中发送电子邮件和创建活动
- 为什么我的 Onclick 箭头功能在 React 中不起作用？
- 在此代码中是否有使用“this”的替代方法？
- 在 SQL Server 和 PostgreSQL 上查询，我如何从第一个表获得第二个表的可视化
- 每千个数字得到
- 更新了城市边界 KML 文件的来源？