how to create drag and drop in wpf? - wpf

i want drag on treevieew one and drop in treeview tow
TreeView one
<TreeView Name="tvMain" FontSize="14" Grid.Row="2" Background="#FFF9F9F9" >
<TreeView.ItemContainerStyle>
<Style TargetType="{x:Type TreeViewItem}">
<EventSetter Event="MouseDoubleClick" Handler="TreeView_MouseDoubleClick" />
<EventSetter Event="MouseRightButtonDown" Handler="TreeView_MouseRightClick" />
</Style>
</TreeView.ItemContainerStyle>
<TreeView.ItemTemplate>
<HierarchicalDataTemplate >
<StackPanel Orientation="Horizontal">
<Image DragDrop.DragOver="Image_DragOver" Margin="2" Width="14" Height="14" Source="{Binding Path=ImageUrl}" HorizontalAlignment="Right" VerticalAlignment="Center" ></Image>
<TextBlock Margin="2" Text="{Binding Path=Name}" MinWidth="280" Width="{Binding Path=SizeOfName}" VerticalAlignment="Center" />
<TextBlock Name="lb_params" Text="{Binding Params}" Width="{Binding Path=SizeParams}" VerticalAlignment="Center" TextAlignment="Center"/>
</StackPanel>
</HierarchicalDataTemplate>
</TreeView.ItemTemplate>
</TreeView>
TreeView tow
<TreeView Name="tvMain" FontSize="14" Grid.Row="2" Background="#FFF9F9F9" >
<TreeView.ItemContainerStyle>
<Style TargetType="{x:Type TreeViewItem}">
<EventSetter Event="MouseDoubleClick" Handler="TreeView_MouseDoubleClick" />
<EventSetter Event="MouseRightButtonDown" Handler="TreeView_MouseRightClick" />
</Style>
</TreeView.ItemContainerStyle>
<TreeView.ItemTemplate>
<HierarchicalDataTemplate >
<StackPanel Orientation="Horizontal">
<Image Margin="2" Width="14" Height="14" Source="{Binding Path=ImageUrl}" HorizontalAlignment="Right" VerticalAlignment="Center" ></Image>
<TextBlock Margin="2" Text="{Binding Path=Name}" Width="{Binding Path=SizeOfName}" VerticalAlignment="Center" />
<TextBlock Name="lb_params" Text="{Binding Params}" Width="{Binding Path=SizeParams}" VerticalAlignment="Center" TextAlignment="Center"/>
</StackPanel>
</HierarchicalDataTemplate>
</TreeView.ItemTemplate>
</TreeView>
i have tow treeview
i want drag in treeview one and drop in treeview tow in wpf?

To enable Drag and Drop feature in TreeView control:
Set TreeView two control’s property AllowDrop="True".
Declare three events in TreeView control, i.e. “MouseDown”, “MouseMove”,
“DragOver” and “Drop” events.
<treeview.itemcontainerstyle>
<style targettype="{x:Type TreeViewItem}">
<EventSetter Event="TreeViewItem.DragOver" Handler="treeView_DragOver"/>
<EventSetter Event="TreeViewItem.Drop" Handler="treeView_Drop"/>
<EventSetter Event="TreeViewItem.MouseMove" Handler="treeView_MouseMove"/>
<EventSetter Event="TreeViewItem.MouseDown" Handler="treeView_MouseDown"/>
</style>
</treeview.itemcontainerstyle>
And define event handlers for all the events in your xaml.cs file
Code for drop might help you.
private void treeView_MouseMove(object sender, MouseEventArgs e)
{
try
{
e.Effects = DragDropEffects.None;
e.Handled = true;
TreeViewItem TargetItem = GetNearestContainer
(e.OriginalSource as UIElement);
if (TargetItem != null && draggedItem != null )
{
_target = TargetItem;
e.Effects = DragDropEffects.Move;
} } catch (Exception) { }}

Related

Button within ListBox ItemTemplate not selecting item wpf mvvm

Hi i have the same problem as here Button within ListBox ItemTemplate not selecting item
And i know the reason why my button doesnt see selected item, it because listbox is called when MouseDown
and button is called on Click. But i dont know how to fix it
XAML
<ListBox Grid.Row="1" x:Name="ListViewProduct" Background="#FFf1f1f1" ItemsSource="{Binding Videos}" >
<ListBox.ItemTemplate>
<!-- FIX Ripple-->
<DataTemplate >
<Border Background="White" Name="border" Margin="50 10 50 10" Width="310" Height="360">
<StackPanel>
<Border Width="300" Height="300" CornerRadius="5" Margin="5">
<Border.Effect>
<DropShadowEffect ShadowDepth="5"/>
</Border.Effect>
<Border.Background>
<ImageBrush ImageSource="{Binding Image}"/>
</Border.Background>
</Border>
<Grid>
<StackPanel>
<TextBlock Margin="5" Text="{Binding Name}" FontSize="14" FontFamily="Franklin Gothic Medium" />
<TextBlock Margin="5 0" Text="{Binding User.Name}" FontSize="13" />
</StackPanel>
<Button HorizontalAlignment="Right" Margin="0 0 10 0"
Command="{Binding ElementName= ListViewProduct,Path=DataContext.DownloadPageCommand}"
CommandParameter="{Binding Path=SelectedItem , ElementName=ListViewProduct}">
<materialDesign:PackIcon Width="25" Height="25" Kind="Download" Foreground="White"/>
</Button>
</Grid>
</StackPanel>
<i:Interaction.Triggers>
<i:EventTrigger EventName="MouseLeftButtonUp">
<i:InvokeCommandAction Command="{Binding ElementName= ListViewProduct,Path=DataContext.ViewWatchingPageCommand}"
CommandParameter="{Binding Path=SelectedItem , ElementName=ListViewProduct}"/>
</i:EventTrigger>
</i:Interaction.Triggers>
</Border>
</DataTemplate>
</ListBox.ItemTemplate>
C#
private RelayCommandParametr _downloadpageCommand;
public RelayCommandParametr DownloadPageCommand
{
get
{
return _downloadpageCommand
?? (_downloadpageCommand = new RelayCommandParametr(
obj =>
{
SelectedVideo = obj as Video;
_navigationService.NavigateTo("Download",obj);
}));
}
}
private RelayCommandParametr _viewWatchingPageCommand;
public RelayCommandParametr ViewWatchingPageCommand
{
get
{
return _viewWatchingPageCommand
?? (_viewWatchingPageCommand = new RelayCommandParametr(
(obj) =>
{
SelectedVideo = obj as Video;
_navigationService.NavigateTo("VideoWatching",SelectedVideo);
}));
}
}
<ListBox.ItemContainerStyle>
<Style TargetType="ListBoxItem">
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="IsSelected" Value="True"/>
</Trigger>
</Style.Triggers>
</Style>
</ListBox.ItemContainerStyle>
I find answer i just set selected item.

WPF DataTemplate get Flowdocument

I have two DataTemplate for my EvenementViewModel, one for read only (LectureEvenement) and the second for write (EditeurEvenement).
The template is selected depending of the EvenementViewModel state. These template are used within a TabControl.
From the code behind (Button click), I would like to get the FlowDocument that is in the read only DataTemplate. The goal is to print the FlowDocument.
I need help to get the handle on the FlowDocument that is in the selected tab of the TabControl.
Any suggestion?
There is some part of the XAML code.
<Window.Resources>
<DataTemplate x:Key="EditeurEvenement" DataType="{x:Type local:EvenementViewModel}">
<ScrollViewer Name="Conteneur" HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto">
<StackPanel MaxWidth="1000">
<Border BorderThickness="5" BorderBrush="#55CDD7E1">
<StackPanel Background="#55CDD7E1">
<!-- Centrale -->
<StackPanel DockPanel.Dock="Top" Margin="0,0,0,5" HorizontalAlignment="Left">
<TextBlock VerticalAlignment="Center"><Run Text="Centrale :" FontWeight="Bold"/></TextBlock>
<ComboBox MinWidth="160" ItemsSource="{Binding ListeCentrale}" DisplayMemberPath="Nom" SelectedItem="{Binding Centrale}"/>
</StackPanel>
...
</StackPanel>
</Border>
</StackPanel>
</ScrollViewer>
</DataTemplate>
<DataTemplate x:Key="LectureEvenement" DataType="{x:Type local:EvenementViewModel}">
<FlowDocumentScrollViewer VerticalScrollBarVisibility="Auto">
<FlowDocument FontFamily="Sergoe UI" FontSize="12px" Name="FdEvenement">
<Paragraph>
<!-- Centrale -->
<TextBlock Margin="0,0,0,5"><Run Text="Centrale : " FontWeight="Bold"/><Run Text="{Binding Centrale.Nom, Mode=OneWay}"/></TextBlock>
<LineBreak/>
...
</Paragraph>
</FlowDocument>
</FlowDocumentScrollViewer>
</DataTemplate>
<DataTemplate DataType="{x:Type local:EvenementViewModel}">
<ContentControl Content="{Binding}">
<ContentControl.Style>
<Style TargetType="{x:Type ContentControl}">
<Setter Property="ContentTemplate" Value="{StaticResource LectureEvenement}"></Setter>
<Style.Triggers>
<DataTrigger Binding="{Binding EstModifiable}" Value="True">
<Setter Property="ContentTemplate" Value="{StaticResource EditeurEvenement}"></Setter>
</DataTrigger>
</Style.Triggers>
</Style>
</ContentControl.Style>
</ContentControl>
</DataTemplate>
</Window.Resources>
<TabControl x:Name="TcEvenements" ItemsSource="{Binding ListeOngletOuvert}" SelectedItem="{Binding OngletSelectionne}">
<TabControl.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding TitreTab}" Margin="0,0,5,0" VerticalAlignment="Center"/>
<Button CommandParameter="{Binding DataContext, RelativeSource={RelativeSource AncestorType={x:Type Window}}}" Command="{Binding LancerFermer}">
<Image Source="Icone/icons8-delete-23.png" Width="15"/>
</Button>
</StackPanel>
</DataTemplate>
</TabControl.ItemTemplate>
</TabControl>
The FlowDocumentScrollViewer element is a visual child of the TabControl whenever your template is applied. You can then get a reference to it using the VisualTreeHelper class:
private void Button_Click(object sender, RoutedEventArgs e)
{
FlowDocumentScrollViewer fdsv = FindVisualChild<FlowDocumentScrollViewer>(TcEvenements);
if (fdsv != null)
{
FlowDocument fd = fdsv.Document;
//...
}
}
private T FindVisualChild<T>(Visual visual) where T : Visual
{
for (int i = 0; i < VisualTreeHelper.GetChildrenCount(visual); i++)
{
Visual child = (Visual)VisualTreeHelper.GetChild(visual, i);
if (child != null)
{
T correctlyTyped = child as T;
if (correctlyTyped != null)
{
return correctlyTyped;
}
T descendent = FindVisualChild<T>(child);
if (descendent != null)
{
return descendent;
}
}
}
return null;
}

WPF - Custom ErrorTemplate for all TextBoxes in App

I have a form with many textboxes, each require the same validation Error-template.
Now, i don't wanna write these validation error-templates for every textbox. So where do i have to put that, so that all textboxes are affected?
Textbox with Validation.ErrorTemplate:
<TextBox x:Name="textBox3" TextWrapping="Wrap" Height="23" Text="{Binding User_Id, UpdateSourceTrigger=PropertyChanged, NotifyOnValidationError=True}" VerticalAlignment="Top">
<Validation.ErrorTemplate>
<ControlTemplate>
<StackPanel>
<AdornedElementPlaceholder x:Name="textBox"/>
<ItemsControl ItemsSource="{Binding}">
<ItemsControl.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding ErrorContent}" Foreground="Red"/>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</StackPanel>
</ControlTemplate>
</Validation.ErrorTemplate>
</TextBox>
My CustomControl:
public class ValidationTextBox : TextBox
{
static ValidationTextBox()
{
DefaultStyleKeyProperty.OverrideMetadata(typeof(ValidationTextBox), new FrameworkPropertyMetadata(typeof(ValidationTextBox)));
//Validation.SetErrorTemplate(new ValidationTextBox(), )
}
public ValidationTextBox() { }
}
You need to define new Style for TextBox inside a "Resourse" tag of textbox's container. This style will be implemented for each textbox inside container.
Example:
<StackPanel>
<StackPanel.Resources>
<Style TargetType=TextBox>
<Setter Property="Validation.ErrorTemplate">
<Setter.Value>
<ControlTemplate>
<StackPanel>
<AdornedElementPlaceholder x:Name="textBox"/>
<ItemsControl ItemsSource="{Binding}">
<ItemsControl.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding ErrorContent}" Foreground="Red"/>
</DataTemplate>
</ItemsControl.ItemTemplate>
</ItemsControl>
</StackPanel>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</StackPanel.Resources
<TextBox/>
<TextBox/>
<TextBox/>
</StackPanel>

Textbox inside listbox selecteditem.. how modify textbox content?

I have a listbox for inventory. When I select an item it shows a couple of controls to edit the volume or amount of items. like this:
<StackPanel HorizontalAlignment="Right" Orientation="Horizontal" >
<Label Content="Edit Volume:"/>
<Button Click="bPlus_Click2" Content="+" Height="29" Margin="10,0,0,0" Name="bPlus" Width="29" />
<TextBox FontSize="16" Height="29" HorizontalContentAlignment="Center" IsReadOnly="True" Name="tNum2" Text="0" VerticalContentAlignment="Center" Width="44" />
<Button Click="bMinus_Click2" Content="-" Height="29" Name="bMinus" Width="29" />
<Button Content="OK!"/>
<StackPanel.Style>
<Style>
<Style.Triggers>
<DataTrigger Binding="{Binding Path=IsSelected, RelativeSource={RelativeSource Mode=FindAncestor,AncestorType={x:Type ListBoxItem}}}" Value="False">
<Setter Property="StackPanel.Visibility" Value="Collapsed"></Setter>
</DataTrigger>
</Style.Triggers>
</Style>
</StackPanel.Style>
</StackPanel>
Now I need the PLUS and MINUS buttons to edit the content of the textbox.. how can i do it??
I FOUND THE WAY!!
THIS IS WHAT I HAVE:
<Window.Resources>
<DataTemplate x:Key="dtInventory">
<Border Name="itemBorder" BorderBrush="#FFEBE476" BorderThickness="2" Padding="10" Margin="2" Background="#FF5AB11D">
<StackPanel x:Name="sp1">
<StackPanel Orientation="Horizontal" x:Name="spsp1">
<StackPanel Width="60">
<TextBlock Text="DME Item: "/>
</StackPanel>
<StackPanel Width="205" x:Name="spsp2">
<TextBlock Text="{Binding Path=Name}"/>
</StackPanel>
<StackPanel Width="60" x:Name="spsp3">
<TextBlock Text="Volume: "/>
</StackPanel>
<StackPanel Width="30" x:Name="spsp4">
<TextBlock Text="{Binding Path=Volume}"/>
</StackPanel>
</StackPanel>
<StackPanel x:Name="sp2" HorizontalAlignment="Right" Orientation="Horizontal" >
<Label Content="Edit Volume:" x:Name="l1"/>
<myext:IntegerUpDown x:Name="udVolume" Minimum="0" DefaultValue="0"/>
<Button Content="OK!" x:Name="bOk" Click="bOk_Click" />
<StackPanel.Style>
<Style>
<Style.Triggers>
<DataTrigger Binding="{Binding Path=IsSelected, RelativeSource={RelativeSource Mode=FindAncestor,AncestorType={x:Type ListBoxItem}}}" Value="False">
<Setter Property="StackPanel.Visibility" Value="Collapsed"></Setter>
</DataTrigger>
</Style.Triggers>
</Style>
</StackPanel.Style>
</StackPanel>
</StackPanel>
</Border>
</DataTemplate>
</Window.Resources>
Then the Listbox:
<ListBox Height="399" HorizontalAlignment="Left" Margin="462,61,0,0" Name="lInventory" VerticalAlignment="Top" Width="390" ItemsSource="{Binding}" ItemTemplate="{StaticResource dtInventory}">
And the .cs:
ListBoxItem selecteditem = lInventory.ItemContainerGenerator.ContainerFromIndex(int.Parse(lInventory.SelectedIndex.ToString())) as ListBoxItem;
if (selecteditem != null)
{
try
{
DataTemplate dt = selecteditem.ContentTemplate;
Border border = VisualTreeHelper.GetChild(selecteditem, 0) as Border;
ContentPresenter cp = border.Child as ContentPresenter;
StackPanel sp = dt.FindName("sp1", cp) as StackPanel;
IntegerUpDown updown = sp.FindName("udVolume") as IntegerUpDown;
if (updown.Value != 0)
{
Inventory.DMEItems dme = new Inventory.DMEItems();
dme.Volume = int.Parse(updown.Value.ToString());
dme.DMEInventoryItemID = int.Parse(lInventory.SelectedValue.ToString());
dme.UpdateItem();
UpdateInventory();
}
}
catch (Exception ex)
{ System.Windows.MessageBox.Show("ERROR: " + ex.Message, "Edit Volume" ,MessageBoxButton.OK, MessageBoxImage.Error); }
}
I hope it works for other people!
Unfortunately you can't do Mathematic oeprations in xaml out of the box.
But you could use a Numeric UpDown control (e.g. from the Extented WPF Toolkit)
Or you make your own UserControl where you have your two buttons and your textbox along with the functionality to count up/down.
Then use that control in your markup e.g.
<StackPanel HorizontalAlignment="Right" Orientation="Horizontal" >
<Label Content="Edit Volume:"/>
<local:MyNumericUpDownControl/>
EDIT:
Here's a link on how to create your own numericupdown control

Changing ContentTemplate based on ListBox selection

I have a Listbox and a Border in a StackPanel similar to the following:
<StackPanel Orientation="Horizontal">
<ListBox>
<ListBoxItem Content="People"/>
<ListBoxItem Content="Animals"/>
<ListBoxItem Content="Cars"/>
</ListBox>
<Border Width="200>
<ContentPresenter/>
</Border>
</StackPanel>
When selecting an item in the listbox I would like to change the content in the ContentPresenter accordingly e.g. selecting People would change the template to display a series of input fields related to people where as selecting Animals would display a series of fields related to Animals etc. - the behavior of this would be akin to a TabControl.
I think I can achieve this with a DataTrigger which changes the DataTemplate in the Border but I'm not sure how to achieve this.
Any pointers?
Thanks
You can toggle the ContentTemplate using a DataTrigger as follows.
Note, that I am binding an ObservableCollection to a simple object (Thing) with one property called Name, and am I binding the Content of the ContentControl to the SelectedItem in the ListBox using a ViewModel.
<Grid>
<Grid.Resources>
<local:MultiValueConverter x:Key="con" />
<DataTemplate x:Key="PeopleTemplate">
<StackPanel Orientation="Horizontal">
<Label Margin="0,0,5,0" Content="People Name" HorizontalAlignment="Left" Grid.Column="0" />
<TextBox Grid.Column="1" Width="100" Height="25"></TextBox>
<Button Content="OK" Grid.Column="2" />
</StackPanel>
</DataTemplate>
<DataTemplate x:Key="AnimalsTemplate">
<StackPanel Orientation="Horizontal">
<Label Margin="0,0,5,0" Content="Animal Name" HorizontalAlignment="Left" Grid.Column="0" />
<TextBox Grid.Column="1" Width="100" Height="25"></TextBox>
<Button Content="OK" Grid.Column="2" />
</StackPanel>
</DataTemplate>
<DataTemplate x:Key="CarsTemplate">
<StackPanel Orientation="Horizontal">
<Label Margin="0,0,5,0" Content="Car Name" HorizontalAlignment="Left" Grid.Column="0" />
<TextBox Grid.Column="1" Width="100" Height="25"></TextBox>
<Button Content="OK" Grid.Column="2" />
</StackPanel>
</DataTemplate>
</Grid.Resources>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<StackPanel Grid.Row="0" Orientation="Horizontal">
<ListBox ItemsSource="{Binding Things}" SelectedItem="{Binding SelectedThing}">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Margin="0" Orientation="Horizontal">
<TextBlock Padding="5" Text="{Binding Name}" Margin="0"></TextBlock>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
<Border Width="200">
<ContentControl Content="{Binding SelectedThing}">
<ContentControl.ContentTemplate>
<DataTemplate>
<ContentControl Name="cc"
Content="{Binding}"
ContentTemplate="{StaticResource PeopleTemplate}" />
<DataTemplate.Triggers>
<DataTrigger Binding="{Binding Path=Name}" Value="People">
<Setter TargetName="cc"
Property="ContentTemplate"
Value="{StaticResource PeopleTemplate}" />
</DataTrigger>
<DataTrigger Binding="{Binding Path=Name}" Value="Animals">
<Setter TargetName="cc"
Property="ContentTemplate"
Value="{StaticResource AnimalsTemplate}" />
</DataTrigger>
<DataTrigger Binding="{Binding Path=Name}" Value="Cars">
<Setter TargetName="cc"
Property="ContentTemplate"
Value="{StaticResource CarsTemplate}" />
</DataTrigger>
</DataTemplate.Triggers>
</DataTemplate>
</ContentControl.ContentTemplate>
</ContentControl>
</Border>
</StackPanel>
<Grid>
Here is the Thing class:
public class Thing
{
public Thing(String name)
{
this.Name = name;
}
public String Name { get; set; }
public static ObservableCollection<Thing> GetThingList()
{
return new ObservableCollection<Thing>(new Thing[3] {
new Thing("People"),
new Thing("Animals"),
new Thing("Cars")
});
}
}

Resources