1 Replies - 442 Views - Last Post: 23 July 2013 - 01:01 AM Rate Topic: -----

#1 vck9tqvo0351i8x  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 2
  • Joined: 22-July 13

Problems with using Canvas in Listbox

Posted 22 July 2013 - 10:11 PM

I am trying to set the Canvas properties in a Listbox with Silverlight 4. After running this program, you can see two columns, with two buttons initially in the right one. The left column isn't important to me. But I want to be able to drag the buttons anywhere in the right-hand side column. But whenever I drag the buttons to the left column and then drag them around in the right column, they always get placed in the upper-left corner. In the right-hand side column, why can't I place them somewhere else, such as in the middle or lower-right corner?

I have already read the article "One more platform difference more-or-less tamed [SetterValueBindingHelper makes Silverlight Setters better!]" by David Anson and used the SetterValueBindingHelper, but it still doesn't work

The sole purpose of this program is to be able to drag multiple buttons simultaneously. I was only able to do this by creating a Listbox and then setting the SelectionMode to 'Multiple'

using System;
using System.Collections.Generic;
using System.Linq;
using System.Net;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Animation;
using System.Windows.Shapes;


namespace SilverlightBusinessDragDrop
{
    public partial class MainPage : UserControl
    {

        string BoxSelected = string.Empty;
        ListBox bs = new ListBox();
        ListBox bd = new ListBox();
        List<string> SourceNames = new List<string>();
        List<string> DestinationNames = new List<string>();

        public MainPage()
        {
            InitializeComponent();
            CreateObjects();
        }

        private void CreateObjects()
        {
            ListBoxDragDropTarget source = new ListBoxDragDropTarget();
            source.Drop += new Microsoft.Windows.DragEventHandler(dest_Drop);
            source.AllowDrop = true;
            box1.Margin = new Thickness(1, 1, 0, 0);
            box1.Background = new SolidColorBrush(Colors.Transparent);
            box1.Width = 240;
            box1.Height = 360;

            // Create Items for the List Box
            ListBoxItem i1 = new ListBoxItem();
            i1.BorderBrush = new SolidColorBrush(Colors.Orange);
            i1.BorderThickness = new Thickness(1);
            i1.Name = "1";

            Button s1 = new Button();
            s1.Content = "button1";
            s1.Background = new SolidColorBrush(Colors.Yellow);
            s1.Width = 80;
            s1.Height = 50;

            ListBoxItem i2 = new ListBoxItem();
            i2.BorderBrush = new SolidColorBrush(Colors.Red);
            i2.BorderThickness = new Thickness(1);
            i2.Name = "2";

            Button s2 = new Button();
            s2.Content = "button2";
            s2.Background = new SolidColorBrush(Colors.Green);
            s2.Width = 87;
            s2.Height = 50;

            i1.Content = s1;
            box1.Items.Add(i1);
            i2.Content = s2;
            box1.Items.Add(i2);

            Canvas column2 = new Canvas();
            column2.Margin = new Thickness(200, 0, 0, 0);
            column2.HorizontalAlignment = System.Windows.HorizontalAlignment.Left;
            column2.VerticalAlignment = System.Windows.VerticalAlignment.Bottom;
            column2.Width = 150;
            column2.Height = 400;

            TextBlock hdr2 = new TextBlock();
            hdr2.Text = "Column 2";
            hdr2.Height = 30;
            hdr2.Margin = new Thickness(0, 0, 0, 0);
            hdr2.HorizontalAlignment = System.Windows.HorizontalAlignment.Center;
            hdr2.VerticalAlignment = System.Windows.VerticalAlignment.Top;

            ListBoxDragDropTarget dest = new ListBoxDragDropTarget();
            dest.Drop += new Microsoft.Windows.DragEventHandler(dest_Drop);
            dest.AllowDrop = true;

            ListBox box2 = new ListBox();
            box2.Name = "Column2";
            box2.Margin = new Thickness(1, 1, 0, 0);
            box2.Background = new SolidColorBrush(Colors.Transparent);
            box2.FlowDirection = System.Windows.FlowDirection.LeftToRight;
            box2.HorizontalAlignment = System.Windows.HorizontalAlignment.Right;
            box2.VerticalAlignment = System.Windows.VerticalAlignment.Stretch;
            box2.Width = 140;
            box2.Height = 360;

            column2.Children.Add(hdr2);
            dest.Content = box2;
            column2.Children.Add(dest);

            DragDropRoot.Children.Add(column2);
        }

        void dest_Drop(object sender, Microsoft.Windows.DragEventArgs e)
        {
        // Here we handle the object that was dropped
            var format = e.Data.GetFormats()[0];
            ItemDragEventArgs dragItem = e.Data.GetData(format) as ItemDragEventArgs;
            bs = (ListBox)dragItem.DragSource;
            ListBoxDragDropTarget b = (ListBoxDragDropTarget)sender;
            bd = (ListBox)b.Content;
        }

    }
}


and the XAML

<UserControl xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk"  x:Class="SilverlightBusinessDragDrop.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             xmlns:toolKit="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Toolkit"
             xmlns:local="clr-namespace:Delay"
    mc:Ignorable="d"
    d:DesignHeight="500" d:DesignWidth="600">



    <Grid x:Name="LayoutRoot" Background="White">
        <TextBlock Margin="20,0,0,0" HorizontalAlignment="Left" VerticalAlignment="Top" Text="Silverlight Business Drag and Drop" FontSize="16"></TextBlock>
        <Grid x:Name="DragDropRoot" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="40,40,0,0">

            <toolKit:ListBoxDragDropTarget AllowDrop="True">
                <ListBox Canvas.Left="76" Canvas.Top="62" x:Name="box1" Height="200" Width="200"  SelectionMode="Multiple"
                            DisplayMemberPath="Name" VerticalContentAlignment="Center">


                    <ListBox.ItemContainerStyle>
                    <Style  TargetType="ListBoxItem">
                        <Setter Property="local:SetterValueBindingHelper.PropertyBinding">
                            <Setter.Value>
                                <local:SetterValueBindingHelper>
                                    <local:SetterValueBindingHelper Type="Canvas" Property="Left" Binding="{Binding X}" />
                                    <local:SetterValueBindingHelper Type="Canvas" Property="Top" Binding="{Binding Y}" />
                                    <local:SetterValueBindingHelper Type="Canvas" Property="ZIndex" Binding="{Binding ZIndex.Value}" />
                                </local:SetterValueBindingHelper>
                            </Setter.Value>
                        </Setter>
                        <Setter Property="Template">
                            <Setter.Value>
                                <ControlTemplate TargetType="ListBoxItem">
                                    <ContentPresenter/>
                                </ControlTemplate>
                            </Setter.Value>
                        </Setter>
                    </Style>
                    </ListBox.ItemContainerStyle>

                    <ListBox.ItemsPanel>
                        <ItemsPanelTemplate>
                            <Canvas  />
                        </ItemsPanelTemplate>
                    </ListBox.ItemsPanel>

                </ListBox>
            </toolKit:ListBoxDragDropTarget>
        </Grid>
    </Grid>
</UserControl>


Is This A Good Question/Topic? 0
  • +

Replies To: Problems with using Canvas in Listbox

#2 vck9tqvo0351i8x  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 2
  • Joined: 22-July 13

Re: Problems with using Canvas in Listbox

Posted 23 July 2013 - 01:01 AM

It's not like I'm picky about using a Listbox. I just need to be able to select multiple objects (buttons, rectangles, etc) and drag them at the same time. The only way I have found so far that lets me do this is by using a Listbox. Please tell me if there are other methods
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1