Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<p>You can create a List of Border, take the first and last Border from your List and apply a corner radius.</p> <p>XAML:</p> <pre><code>&lt;Window x:Class="TestWpf.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:TestWpf="clr-namespace:TestWpf" Title="MainWindow" Height="350" Width="525"&gt; &lt;Window.Resources&gt; &lt;TestWpf:AchievedConverter x:Key="AchievedConverter"/&gt; &lt;/Window.Resources&gt; &lt;Grid&gt; &lt;ListBox Name="listBox" ScrollViewer.HorizontalScrollBarVisibility="Disabled" ItemsSource="{Binding Bars}"&gt; &lt;ListBox.ItemsPanel&gt; &lt;ItemsPanelTemplate&gt; &lt;WrapPanel IsItemsHost="True" /&gt; &lt;/ItemsPanelTemplate&gt; &lt;/ListBox.ItemsPanel&gt; &lt;ListBox.ItemTemplate&gt; &lt;DataTemplate&gt; &lt;Border Height="10" CornerRadius="{Binding Corner}" Width="{Binding Width}" Background="{Binding IsAchieved, Converter={StaticResource AchievedConverter}}"/&gt; &lt;/DataTemplate&gt; &lt;/ListBox.ItemTemplate&gt; &lt;/ListBox&gt; &lt;/Grid&gt; &lt;/Window&gt; </code></pre> <p>C#:</p> <pre><code>/// &lt;summary&gt; /// Interaction logic for MainWindow.xaml /// &lt;/summary&gt; public partial class MainWindow : Window { private ObservableCollection&lt;Bar&gt; _bars; public MainWindow() { InitializeComponent(); this.DataContext = this; _bars = new ObservableCollection&lt;Bar&gt;(); //Init _bars.Add(new Bar {Width = 20, IsAchieved = true, Corner = new CornerRadius(5, 0, 0, 5)}); _bars.Add(new Bar {Width = 60, IsAchieved = true}); _bars.Add(new Bar {Width = 80, IsAchieved = true}); _bars.Add(new Bar {Width = 20, IsAchieved = false}); _bars.Add(new Bar {Width = 50, IsAchieved = false, Corner = new CornerRadius(0, 5, 5, 0)}); } public ObservableCollection&lt;Bar&gt; Bars { get { return _bars; } } } public class Bar { public double Width { get; set; } public bool IsAchieved { get; set; } public CornerRadius Corner { get; set; } } public class AchievedConverter : IValueConverter { public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture) { if ((bool)value) return new SolidColorBrush(Colors.Green); else return new SolidColorBrush(Colors.Red); } public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture) { throw new NotImplementedException(); } } </code></pre> <p><img src="https://i.stack.imgur.com/3lOsp.png" alt="enter image description here"></p>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload