Перетащите элементы управления в Canvas так, чтобы, когда один перемещается, перемещайте другой в том же направлении - PullRequest
0 голосов
/ 01 ноября 2019

У меня есть два больших пальца, которые выглядят как прямоугольники на холсте. У меня есть требование, когда, если 1 прямоугольник перемещается, я хочу переместить другой прямоугольник (в том же направлении), то есть с теми же e.HorizontChange и e.VerticalChange, но они не должны выходить за границы Canvas. Пожалуйста, помогите.

Xaml:

<Grid x:Name="gridBarImagePanel" Grid.Row="2" HorizontalAlignment="Center" BorderBrush="Black" BorderThickness="2" Margin="7">
            <uwpControls:ImageEx x:Name="BarCodeImage" IsCacheEnabled="True" Source="/SampleImage/demo.png">

            </uwpControls:ImageEx>
                <Canvas x:Name="cnvBarCodeImage" Canvas.ZIndex="100" Height="{Binding ElementName=gridBarImagePanel,Path=ActualHeight}" 
                        Width="600">

                </Canvas>
            </Grid>

Код сзади:

1) Динамическое заполнение элементов управления Thumb

private void CreateUIShapes(int numberOfWindows, List<Dimensions> dimensions)
        {
            Thumb th = null;
            for(int i = 0; i < numberOfWindows; i++)
            {
                th = new Thumb();
                th.Name = string.Format("{0}{1}", "Thumb", i + 1);
                var item = dimensions[i];
                th.Width = item.Width;
                th.Height = item.Height;
                th.Foreground = new SolidColorBrush(Windows.UI.Colors.Transparent);
                th.BorderBrush = item.BorderColor;
                th.BorderThickness = new Thickness(3);
                th.DragDelta += Th_DragDelta;
                th.DragCompleted += Th_DragCompleted;
                Canvas.SetLeft(th,item.left);
                Canvas.SetTop(th, item.Top);
                cnvBarCodeImage.Children.Add(th);
            }
        }

2) Обработка события DragDelta объектавыбранный Thumb

   private void Th_DragDelta(object sender, DragDeltaEventArgs e)
        {
            var SelectedDraggableThumb = sender as Thumb;
            double left = (Canvas.GetLeft(SelectedDraggableThumb) > 0) ? Canvas.GetLeft(SelectedDraggableThumb) : 0; //Prevent moving left beyond the boundry
            double top = (Canvas.GetTop(SelectedDraggableThumb) > 0) ? Canvas.GetTop(SelectedDraggableThumb) : 0; //Prevent moving top beyond the boundry
            left = (Canvas.GetLeft(SelectedDraggableThumb) > BarCodeImage.ActualWidth - SelectedDraggableThumb.ActualWidth) ? BarCodeImage.ActualWidth - SelectedDraggableThumb.ActualWidth : left; //Prevent moving right beyond the boundry
            top = (Canvas.GetTop(SelectedDraggableThumb) > BarCodeImage.ActualHeight - SelectedDraggableThumb.ActualHeight) ? BarCodeImage.ActualHeight - SelectedDraggableThumb.ActualHeight : top;//Prevent moving bottom beyond the boundry
            Canvas.SetLeft(SelectedDraggableThumb, left + e.HorizontalChange);
            Canvas.SetTop(SelectedDraggableThumb, top + e.VerticalChange);

            //Set the dimensions for the other Thumb.
            var OtherDraggableThumb = cnvBarCodeImage.Children.OfType<Thumb>().Single(child => child.Name != SelectedDraggableThumb.Name); //I tried setting the e.HorizontalChange and e.VerticalChange like above but it dosen't work. How should I proceed from here. Please help.

        }

3) Передача данных для создания Thumbs

var dimensions = new List<Dimensions>();
dimensions.Add(new Dimensions() { Height = 200, Width = 400, left = 100, Top = 60, BorderColor = new SolidColorBrush(Windows.UI.Colors.Green) });
dimensions.Add(new Dimensions() { Height = 200, Width = 400, left = 100, Top = 280, BorderColor = new SolidColorBrush(Windows.UI.Colors.Blue) });
CreateUIShapes(2, dimensions);
...