I have problem with binding, I'm trying to move rectangle when mouse is moved, this is my list:
<ListBox x:Name="icTables" FlowDirection="LeftToRight" ItemsSource="{Binding Path=ocTablesinSection,UpdateSourceTrigger=PropertyChanged}" Margin="0,101,52,0" Grid.Column="1" SelectionMode="Extended" HorizontalAlignment="Right" Width="705" Height="400" VerticalAlignment="Top">
<ListBox.ItemsPanel>
<ItemsPanelTemplate>
<Canvas/>
</ItemsPanelTemplate>
</ListBox.ItemsPanel>
<ItemsControl.ItemContainerStyle>
<Style
TargetType="ListBoxItem">
<Setter Property="Canvas.Left" Value="{Binding Path=CLeft,UpdateSourceTrigger=PropertyChanged}"/>
<Setter Property="Canvas.Top" Value="{Binding Path=CTop,UpdateSourceTrigger=PropertyChanged}"/>
</Style>
</ItemsControl.ItemContainerStyle>
<ListBox.ItemTemplate>
<DataTemplate>
<Grid>
<Rectangle Width="50" Height="50" Fill="Red" Cursor="Hand" MouseDown="Rectangle_MouseDown" MouseUp="Rectangle_MouseUp" MouseMove="Rectangle_MouseMove" />
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
In MouseMove event in code behind:
private void Rectangle_MouseMove(object sender, MouseEventArgs e)
{
if (isDraggingRectangle)
{
//
// Drag-move selected rectangles.
//
Point curMouseDownPoint = e.GetPosition(this);
var dragDelta = curMouseDownPoint - origMouseDownPoint;
origMouseDownPoint = curMouseDownPoint;
foreach (var item in ocTablesinSection)
{
item.CLeft += dragDelta.X;
item.CTop += dragDelta.Y;
}
}
else if (isLeftMouseDownOnRectangle)
{
//
// The user is left-dragging the rectangle,
// but don't initiate the drag operation until
// the mouse cursor has moved more than the threshold value.
//
Point curMouseDownPoint = e.GetPosition(this);
var dragDelta = curMouseDownPoint - origMouseDownPoint;
double dragDistance = Math.Abs(dragDelta.Length);
if (dragDistance > DragThreshold)
{
//
// When the mouse has been dragged more than the threshold value commence dragging the rectangle.
//
isDraggingRectangle = true;
}
e.Handled = true;
}
}
Every thing works but the UI don't show updated (Rectangle do not move), When I change CLeft and CTop to a public variable and the window as Element-name it works !!
What is the problem in my code the prevent the rectangle from moving with mouse?
// Update --
private ObservableCollection<TablesinSection> _ocTablesinSection;
public ObservableCollection ocTablesinSection { get { return _ocTablesinSection; } set { _ocTablesinSection = value; OnPropertyChanged("ocTablesinSection"); } }
WPF bindings doesn't work with fields . It works only with properties
.
Declare them as properties.
public double CLeft { get; set; }
public double CTop { get; set; }
Also in case you want to update UI on any property change, you have to implement INotifyPropertyChanged interface on class containing this property.
UPDATE
Make properties to raise PropertyChangedEvent
:
private double cLeft;
public double CLeft
{
get
{
return cLeft;
}
set
{
if(cLeft != value)
{
cLeft = value;
OnPropertyChanged("CLeft");
}
}
}
Do this same for CTop
as well.
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.