I am showing a list of alerts on the UI using a View. If the alert is not read, I need to show a red circle on the left side of it and I need to show the unread count on the tab icon. But currently only a gray circle is showing on the UI and count is also no showing.
Please check the below screenshot:

Xaml:
<ctrl:SwipeableListView VerticalOptions="Fill" HorizontalOptions="Fill"
SelectedItemCommand="{Binding SelectedItemCommand, Mode=TwoWay}"
LeftButtonCommand="{Binding ReadCommand}"
LeftButtonEnabled="true"
RightButtonEnabled="true"
RightButtonCommand="{Binding ArchiveCommand}"
Items="{Binding Notifications}"
AutomationProperties.IsInAccessibleTree="False"
EmptyView="{x:Reference _stackLayout}" />
SwipeableListView.cs:
public class SwipeableListView : View
{
public static readonly BindableProperty ItemsProperty =
BindableProperty.Create(nameof(Items), typeof(IEnumerable<Swipeable>), typeof(SwipeableListView),
new List<Swipeable>(), propertyChanged: OnItemsChanged, defaultBindingMode: BindingMode.TwoWay);
public IEnumerable<Swipeable> Items
{
get { return (IEnumerable<Swipeable>)GetValue(ItemsProperty); }
set { SetValue(ItemsProperty, value); }
}
public static readonly BindableProperty LeftButtonEnabledProperty =
BindableProperty.Create(nameof(LeftButtonEnabled), typeof(bool), typeof(SwipeableListView), true);
public bool LeftButtonEnabled
{
get { return (bool)GetValue(LeftButtonEnabledProperty); }
set { SetValue(LeftButtonEnabledProperty, value); }
}
public static readonly BindableProperty LeftButtonColorProperty =
BindableProperty.Create(nameof(LeftButtonColor), typeof(string), typeof(SwipeableListView), "#007ac9");
public string LeftButtonColor
{
get { return (string)GetValue(LeftButtonColorProperty); }
set { SetValue(LeftButtonColorProperty, value); }
}
public static readonly BindableProperty RightButtonColorProperty =
BindableProperty.Create(nameof(RightButtonColor), typeof(string), typeof(SwipeableListView), "#004aa9");
public string RightButtonColor
{
get { return (string)GetValue(RightButtonColorProperty); }
set { SetValue(RightButtonColorProperty, value); }
}
public static readonly BindableProperty RightButtonEnabledProperty =
BindableProperty.Create(nameof(RightButtonEnabled), typeof(bool), typeof(SwipeableListView), true);
public bool RightButtonEnabled
{
get { return (bool)GetValue(RightButtonEnabledProperty); }
set { SetValue(RightButtonEnabledProperty, value); }
}
public static readonly BindableProperty SelectedItemCommandProperty =
BindableProperty.Create(nameof(SelectedItemCommand), typeof(ICommand), typeof(SwipeableListView), null);
public ICommand SelectedItemCommand
{
get { return (ICommand)GetValue(SelectedItemCommandProperty); }
set { SetValue(SelectedItemCommandProperty, value); }
}
public static readonly BindableProperty LeftButtonCommandProperty =
BindableProperty.Create(nameof(LeftButtonCommand), typeof(ICommand), typeof(SwipeableListView), null);
public ICommand LeftButtonCommand
{
get { return (ICommand)GetValue(LeftButtonCommandProperty); }
set { SetValue(LeftButtonCommandProperty, value); }
}
public static readonly BindableProperty RightButtonCommandProperty =
BindableProperty.Create(nameof(RightButtonCommand), typeof(ICommand), typeof(SwipeableListView), null);
public ICommand RightButtonCommand
{
get { return (ICommand)GetValue(RightButtonCommandProperty); }
set { SetValue(RightButtonCommandProperty, value); }
}
private static void OnItemsChanged(BindableObject bindable, object oldValue, object newValue)
{
var swipeableListView = bindable as SwipeableListView;
if (ItemsChangedEvent != null)
ItemsChangedEvent.Invoke(swipeableListView, (IEnumerable<Swipeable>)newValue);
UpdateEmptyView(swipeableListView);
}
public static event EventHandler<IEnumerable<Swipeable>> ItemsChangedEvent;
public static readonly BindableProperty EmptyViewProperty =
BindableProperty.Create(nameof(EmptyView), typeof(View), typeof(SwipeableListView), null, propertyChanged: OnEmptyViewChanged);
public View EmptyView
{
get { return (View)GetValue(EmptyViewProperty); }
set { SetValue(ItemsProperty, value); }
}
private static void OnEmptyViewChanged(BindableObject bindable, object oldValue, object newValue)
{
UpdateEmptyView((SwipeableListView)bindable);
}
private static void UpdateEmptyView(SwipeableListView swipeableListView)
{
if (swipeableListView?.EmptyView != null)
{
if (swipeableListView.Items == null || !swipeableListView.Items.Any())
{
swipeableListView.EmptyView.IsVisible = true;
}
else
{
swipeableListView.EmptyView.IsVisible = false;
}
}
}
}
Handler code is very lengthy, so adding it as a text file below:
SwipeableListViewHandler.txt
In handler there is below code:
NewInfoIndicatorButton = itemView.FindViewById<Button>(MAUI.Clinical6.Resource.Id.button_red_circle);
button_red_circle:
<Button
android:id="@+id/button_red_circle"
android:layout_width="10dp"
android:layout_height="10dp"
android:layout_marginTop="7dp"
android:layout_marginRight="2dp"
android:background="@drawable/zzz_red_circle"
android:enabled="false" />
zzz_red_circle:
<?xml version="1.0" encoding="UTF-8" ?>
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="oval">
<solid
android:color="#BE1717"/>
<size
android:width="2dp"
android:height="2dp"/>
</shape>
I have added the zzz_red_circle under the .NET MAUI Class Library projects ->Platform -> Android -> Resources -> Drawable folder and set the build action to AndroidResource. But the red circle is not visible on both sections.