Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>I Have a running sample that uses the MVVM Pattern and creates Lines within a <code>ListBox</code> that has a <code>Canvas</code> as its <code>ItemsPanel</code>.</p> <p>I actually made it for <a href="https://stackoverflow.com/questions/15278625/rendering-lines-as-selectable-controls-with-properties">this question</a>, but the OP kind of dissapeared and never contacted me about it.</p> <p>This is what it looks like in my computer:</p> <p><img src="https://i.stack.imgur.com/v9rAy.png" alt="enter image description here"></p> <p>The main part of it is this:</p> <pre><code>&lt;ListBox ItemsSource="{Binding}" x:Name="lst" Height="500" Width="500"&gt; &lt;ListBox.ItemsPanel&gt; &lt;ItemsPanelTemplate&gt; &lt;Canvas IsItemsHost="True"/&gt; &lt;/ItemsPanelTemplate&gt; &lt;/ListBox.ItemsPanel&gt; &lt;ListBox.ItemContainerStyle&gt; &lt;Style TargetType="ListBoxItem"&gt; &lt;Setter Property="FocusVisualStyle"&gt; &lt;Setter.Value&gt; &lt;Style TargetType="Control"&gt; &lt;Setter Property="Opacity" Value="0"/&gt; &lt;/Style&gt; &lt;/Setter.Value&gt; &lt;/Setter&gt; &lt;Setter Property="Template"&gt; &lt;Setter.Value&gt; &lt;ControlTemplate TargetType="ListBoxItem"&gt; &lt;Line X1="{Binding X1}" Y1="{Binding Y1}" X2="{Binding X2}" Y2="{Binding Y2}" StrokeThickness="{Binding Thickness}" Opacity="{Binding Opacity}" x:Name="Line"&gt; &lt;Line.Stroke&gt; &lt;LinearGradientBrush StartPoint="0,0" EndPoint="1,1"&gt; &lt;GradientStop Color="{Binding Color1}" Offset="0"/&gt; &lt;GradientStop Color="{Binding Color2}" Offset="1"/&gt; &lt;/LinearGradientBrush&gt; &lt;/Line.Stroke&gt; &lt;/Line&gt; &lt;ControlTemplate.Triggers&gt; &lt;Trigger Property="IsSelected" Value="true"&gt; &lt;Setter Property="Effect" TargetName="Line"&gt; &lt;Setter.Value&gt; &lt;DropShadowEffect Color="CornflowerBlue" ShadowDepth="3" BlurRadius="10"/&gt; &lt;/Setter.Value&gt; &lt;/Setter&gt; &lt;/Trigger&gt; &lt;/ControlTemplate.Triggers&gt; &lt;/ControlTemplate&gt; &lt;/Setter.Value&gt; &lt;/Setter&gt; &lt;/Style&gt; &lt;/ListBox.ItemContainerStyle&gt; &lt;/ListBox&gt; </code></pre> <p>ViewModel:</p> <pre><code> public class LineViewModel : INotifyPropertyChanged { #region Timer-based Animation private System.Threading.Timer Timer; private static Random Rnd = new Random(); private bool _animate; public bool Animate { get { return _animate; } set { _animate = value; NotifyPropertyChanged("Animate"); if (value) StartTimer(); else StopTimer(); } } private int _animationSpeed = 1; public int AnimationSpeed { get { return _animationSpeed; } set { _animationSpeed = value; NotifyPropertyChanged("AnimationSpeed"); if (Timer != null) Timer.Change(0, 100/value); } } private static readonly List&lt;int&gt; _animationSpeeds = new List&lt;int&gt;{1,2,3,4,5}; public List&lt;int&gt; AnimationSpeeds { get { return _animationSpeeds; } } public void StartTimer() { StopTimer(); Timer = new Timer(x =&gt; Timer_Tick(), null, 0, 100/AnimationSpeed); } public void StopTimer() { if (Timer != null) { Timer.Dispose(); Timer = null; } } private void Timer_Tick() { X1 = X1 + Rnd.Next(-2, 3); Y1 = Y1 + Rnd.Next(-2, 3); X2 = X2 + Rnd.Next(-2, 3); Y2 = Y2 + Rnd.Next(-2, 3); } #endregion #region Coordinates private double _x1; public double X1 { get { return _x1; } set { _x1 = value; NotifyPropertyChanged("X1"); } } private double _y1; public double Y1 { get { return _y1; } set { _y1 = value; NotifyPropertyChanged("Y1"); } } private double _x2; public double X2 { get { return _x2; } set { _x2 = value; NotifyPropertyChanged("X2"); } } private double _y2; public double Y2 { get { return _y2; } set { _y2 = value; NotifyPropertyChanged("Y2"); } } #endregion #region Other Properties private string _name; public string Name { get { return _name; } set { _name = value; NotifyPropertyChanged("Name"); } } private double _thickness; public double Thickness { get { return _thickness; } set { _thickness = value; NotifyPropertyChanged("Thickness"); } } public Color Color1 { get; set; } public Color Color2 { get; set; } private double _opacity = 1; public double Opacity { get { return _opacity; } set { _opacity = value; NotifyPropertyChanged("Opacity"); } } #endregion #region INotifyPropertyChanged public event PropertyChangedEventHandler PropertyChanged; private void NotifyPropertyChanged(string propertyName) { Application.Current.Dispatcher.BeginInvoke((Action)(() =&gt; { if (PropertyChanged != null) PropertyChanged(this, new PropertyChangedEventArgs(propertyName)); })); } #endregion } </code></pre> <p><strong>Edit:</strong> Source code now on <a href="https://github.com/High-Core/WPFSamples/tree/master/LineEditor" rel="nofollow noreferrer">GitHub</a></p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    1. This table or related slice is empty.
 

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