Loading...
Loading...
Compare original and translation side by side
<!-- Basic badge on a button -->
<Button Width="100" Height="50" Content="Inbox">
<notification:SfBadge.Badge>
<notification:SfBadge
Content="10"
Fill="Success"
Shape="Oval"
x:Name="badge"/>
</notification:SfBadge.Badge>
</Button>// C# equivalent
SfBadge sfBadge = new SfBadge();
sfBadge.Name = "badge";
sfBadge.Content = "10";
sfBadge.Fill = BadgeFill.Success;
sfBadge.Shape = BadgeShape.Oval;
Button button = new Button();
button.Width = 100;
button.Height = 50;
button.Content = "Inbox";
SfBadge.SetBadge(button, sfBadge);<!-- Basic badge on a button -->
<Button Width="100" Height="50" Content="Inbox">
<notification:SfBadge.Badge>
<notification:SfBadge
Content="10"
Fill="Success"
Shape="Oval"
x:Name="badge"/>
</notification:SfBadge.Badge>
</Button>// C# equivalent
SfBadge sfBadge = new SfBadge();
sfBadge.Name = "badge";
sfBadge.Content = "10";
sfBadge.Fill = BadgeFill.Success;
sfBadge.Shape = BadgeShape.Oval;
Button button = new Button();
button.Width = 100;
button.Height = 50;
button.Content = "Inbox";
SfBadge.SetBadge(button, sfBadge);<!-- Top-right corner (default) -->
<notification:SfBadge
HorizontalAlignment="Right"
VerticalAlignment="Top"
Content="5"/>
<!-- Bottom-left corner -->
<notification:SfBadge
HorizontalAlignment="Left"
VerticalAlignment="Bottom"
Content="3"/><!-- Top-right corner (default) -->
<notification:SfBadge
HorizontalAlignment="Right"
VerticalAlignment="Top"
Content="5"/>
<!-- Bottom-left corner -->
<notification:SfBadge
HorizontalAlignment="Left"
VerticalAlignment="Bottom"
Content="3"/><notification:SfBadge
AnimationType="Scale"
Content="{Binding UnreadCount}"
Fill="Error"/><notification:SfBadge
AnimationType="Scale"
Content="{Binding UnreadCount}"
Fill="Error"/><notification:SfBadge
Fill="Information"
Shape="Ellipse"
FontSize="16"
FontStyle="Italic"
Content="NEW"/><notification:SfBadge
Fill="Information"
Shape="Ellipse"
FontSize="16"
FontStyle="Italic"
Content="NEW"/><ListView ItemsSource="{Binding MailItems}">
<ListView.ItemTemplate>
<DataTemplate>
<Grid>
<TextBlock Text="{Binding ItemName}"/>
<notification:SfBadge
Content="{Binding UnreadCount}"
Visibility="{Binding HasMessages, Converter={StaticResource BoolToVisibilityConverter}}"
Shape="Oval"/>
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
</ListView><ListView ItemsSource="{Binding MailItems}">
<ListView.ItemTemplate>
<DataTemplate>
<Grid>
<TextBlock Text="{Binding ItemName}"/>
<notification:SfBadge
Content="{Binding UnreadCount}"
Visibility="{Binding HasMessages, Converter={StaticResource BoolToVisibilityConverter}}"
Shape="Oval"/>
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>| Property | Default | Purpose |
|---|---|---|
| null | Badge display text/value |
| Accent | Predefined color state (Success, Error, Warning, etc.) |
| Oval | Badge shape (Oval, Rectangle, Ellipse, None, Custom) |
| Right | Horizontal position (Left, Center, Right, Stretch) |
| Top | Vertical position (Top, Center, Bottom, Stretch) |
| Center | Anchor mode (Inside, Center, Outside, Custom) |
| Center | Anchor mode (Inside, Center, Outside, Custom) |
| None | Animation on content change (Scale, Opacity, None) |
| null | Custom background color (overrides Fill) |
| null | Custom text color |
| 14 | Text size in pixels |
| 1 | Transparency (0-1 range) |
| Visible | Show/hide badge (Visible, Collapsed) |
| 属性 | 默认值 | 用途 |
|---|---|---|
| null | 徽章显示的文本/值 |
| Accent | 预定义颜色状态(Success、Error、Warning等) |
| Oval | 徽章形状(Oval、Rectangle、Ellipse、None、Custom) |
| Right | 水平位置(Left、Center、Right、Stretch) |
| Top | 垂直位置(Top、Center、Bottom、Stretch) |
| Center | 锚点模式(Inside、Center、Outside、Custom) |
| Center | 锚点模式(Inside、Center、Outside、Custom) |
| None | 内容变化时的动画(Scale、Opacity、None) |
| null | 自定义背景色(覆盖Fill属性) |
| null | 自定义文本颜色 |
| 14 | 文本像素尺寸 |
| 1 | 透明度(范围0-1) |
| Visible | 徽章的显示/隐藏(Visible、Collapsed) |