Can't get simple WPF drag and drop to work - wpf

For a simple test I want to drag a Button to a TextBox. I can start dragging the Button, but the Drop event is not raised. What am I missing?
Xaml:
<Window x:Class="DayPlanner.View.DnDTest"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="DnDTest" Height="200" Width="200">
<StackPanel>
<Button Name="button"
Content="OK"
PreviewMouseLeftButtonDown="button_PreviewMouseLeftButtonDown"
PreviewMouseMove="button_PreviewMouseMove"/>
<TextBox Name="textBox"
AllowDrop="True"
DragEnter="textBox_DragEnter"
Drop="textBox_Drop"/>
</StackPanel>
</Window>
Code:
public partial class DnDTest : Window
{
public DnDTest()
{
InitializeComponent();
}
private Point dragStartPoint;
private void button_PreviewMouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
dragStartPoint = e.GetPosition(null);
}
private static bool IsDragging(Point dragStartPoint, MouseEventArgs e)
{
var diff = e.GetPosition(null) - dragStartPoint;
return
e.LeftButton == MouseButtonState.Pressed &&
(Math.Abs(diff.X) > SystemParameters.MinimumHorizontalDragDistance ||
Math.Abs(diff.Y) > SystemParameters.MinimumVerticalDragDistance);
}
private void button_PreviewMouseMove(object sender, MouseEventArgs e)
{
if (IsDragging(dragStartPoint, e))
{
DragDrop.DoDragDrop(button, new DataObject("Button", button), DragDropEffects.Move);
e.Handled = true;
}
}
private void textBox_DragEnter(object sender, DragEventArgs e)
{
e.Handled = true;
}
private void textBox_Drop(object sender, DragEventArgs e)
{
var button = (Button)e.Data.GetData("Button");
textBox.Text = string.Format("[0]", button.Content.ToString());
e.Handled = true;
}
}

This might be some strange case, but to fix it, I needed to handle or dragging events, including the Preview versions.
Here's how to make it work.
Xaml:
<Window x:Class="DayPlanner.View.DnDTestBasic"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="DnDTestBasic" Height="200" Width="200">
<StackPanel>
<Button Name="button"
Content="OK"
PreviewMouseLeftButtonDown="button_PreviewMouseLeftButtonDown"
PreviewMouseMove="button_PreviewMouseMove"/>
<TextBox Name="textBox"
AllowDrop="True"
PreviewDragEnter="textBox_Dragging"
DragEnter="textBox_Dragging"
PreviewDragOver="textBox_Dragging"
DragOver="textBox_Dragging"
Drop="textBox_Drop"/>
<TextBlock Name="status"
Text="No dragging"/>
</StackPanel>
</Window>
Code:
public partial class DnDTestBasic : Window
{
public DnDTestBasic()
{
InitializeComponent();
}
private Point dragStartPoint;
private void button_PreviewMouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
dragStartPoint = e.GetPosition(null);
status.Text = "New drag start position";
}
private static bool IsDragging(Point dragStartPoint, MouseEventArgs e)
{
var diff = e.GetPosition(null) - dragStartPoint;
return
e.LeftButton == MouseButtonState.Pressed &&
(Math.Abs(diff.X) > SystemParameters.MinimumHorizontalDragDistance ||
Math.Abs(diff.Y) > SystemParameters.MinimumVerticalDragDistance);
}
private void button_PreviewMouseMove(object sender, MouseEventArgs e)
{
if (IsDragging(dragStartPoint, e))
{
status.Text = "Starting drag...";
DragDrop.DoDragDrop(button, new DataObject("Button", button), DragDropEffects.Copy);
status.Text = "Dragging done.";
e.Handled = true;
}
}
private void textBox_Dragging(object sender, DragEventArgs e)
{
if (e.Data.GetDataPresent("Button"))
e.Effects = DragDropEffects.Copy;
else
e.Effects = DragDropEffects.None;
e.Handled = true;
}
private void textBox_Drop(object sender, DragEventArgs e)
{
var button = (Button)e.Data.GetData("Button");
textBox.Text = string.Format("[{0}]", button.Content.ToString());
e.Handled = true;
}
}

I believe it has to do with the fact that when you start the drag event, the button control is capturing mouse input. Any mouse movements you do after that are registered to the button instead of to the application
I actually had a similar problem and ended up using MouseEnter/Leave events instead of the built in WPF drag/drop framework.

Related

moving any control in wpf

I am trying to move control in wpf using Canvas
This is the XAML
<Canvas Grid.Column="1" Grid.Row="0" x:Name="DropCanvas" AllowDrop="True" DragOver="DropCanvas_DragOver"
Drop="Canvas_Drop" DragEnter="Canvas_DragEnter" Background="#12000000" >
<TextBox Canvas.Left="162" Canvas.Top="188" Height="23" Name="textBox1" Width="120"
PreviewMouseMove="textBox1_PreviewMouseMove"
PreviewMouseLeftButtonDown="textBox1_PreviewMouseLeftButtonDown"
PreviewMouseUp="textBox1_PreviewMouseUp" />
</Canvas>
and this is the Code
Point p = new Point();
private void textBox1_PreviewMouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
Control control = sender as Control;
control.CaptureMouse();
p = e.GetPosition(control);
}
private void textBox1_PreviewMouseMove(object sender, MouseEventArgs e)
{
Control control = sender as Control;
Point x = e.GetPosition(control);
if (e.LeftButton == MouseButtonState.Pressed)
{
Canvas.SetLeft(control, Canvas.GetLeft(control) + (x.X - p.X));
Canvas.SetTop(control, Canvas.GetTop(control) + (x.Y - p.Y));
}
p = x;
}
private void textBox1_PreviewMouseUp(object sender, MouseButtonEventArgs e)
{
Control control = sender as Control;
control.ReleaseMouseCapture();
activated = false;
}
The code is working, but when it moves, the control shakes.
What is the proplem
When you call GetPosition you should use DropCanvas as the parameter instead of the control. You're seeing vibrations because the TextBox keeps moving and you need something fixed.
Alternatively, you can use the MouseDragElementBehavior available in Expression Blend SDK to move objects in a container.
Also, this project can be useful to you: http://www.codeproject.com/Articles/24681/WPF-Diagram-Designer-Part-4
public void dragme(object sender, MouseButtonEventArgs e)
{
if (_Move.IsChecked == true)
db.Attach((DependencyObject)sender);
}
//// MouseDragElementBehavior db;
private void canvass_PreviewMouseDown(object sender, MouseButtonEventArgs e)
{
if (_Move.IsChecked == true && filmgrid.Visibility == Visibility.Visible)// == true)
{
filmgrid.PreviewMouseDown += new MouseButtonEventHandler(dragme);
}

WPF ToggleButton incorrect render behavior

What is going on here, and how to do a workaround?
Press MyToggleButton. Now it looks like instantly pressed (checked).
At the same time MyToggleButton_Checked handler disables the MyToggleButton.
Now press non-toggle Button 'Enable'. What we see? The MyToggleButton looks like it is enabled. OK. But wait, now it looks like non-pressed! Why?!
XAML:
<StackPanel>
<ToggleButton x:Name="MyToggleButton" Content="MyToggleButton" Checked="MyToggleButton_Checked"/>
<TextBlock Text="{Binding IsChecked, ElementName=MyToggleButton}" Margin="0,4"/>
<Button Name="EnableButton" Content="Enable" Click="EnableButton_Click"/>
<Button Name="DisableButton" Content="Disable" Click="DisableButton_Click"/>
</StackPanel>
Code-behind:
void MyToggleButton_Checked(object sender, RoutedEventArgs e)
{
MyToggleButton.IsEnabled = false;
}
void EnableButton_Click(object sender, RoutedEventArgs e)
{
MyToggleButton.IsEnabled = true;
}
void DisableButton_Click(object sender, RoutedEventArgs e)
{
MyToggleButton.IsEnabled = false;
}
UPD:
The only possible workaround on the moment is:
void EnableButton_Click(object sender, RoutedEventArgs e)
{
MyToggleButton.IsEnabled = true;
var controlTemplate = MyToggleButton.Template;
var buttonChrome = (Microsoft.Windows.Themes.ButtonChrome)controlTemplate.FindName("Chrome", MyToggleButton);
buttonChrome.RenderPressed = false;
buttonChrome.RenderPressed = true;
}
Are there any others?
UPD2:
Another workaround is:
void EnableButton_Click(object sender, RoutedEventArgs e)
{
MyToggleButton.IsEnabled = true;
var controlTemplate = MyToggleButton.Template;
MyToggleButton.Template = null;
MyToggleButton.Template = controlTemplate;
}
But the control is flickering at the moment of template substitution.
That's my solution for the problem, here is the video, the usage:
<StackPanel>
<ToggleButton x:Name="MyToggleButton" Content="MyToggleButton" Checked="MyToggleButton_Checked"
l:CorrectToggleButtonCheckedEnableBehavior.IsActive="True"/>
<Button Name="EnableButton" Content="Enable" Click="EnableButton_Click"/>
</StackPanel>
and the attached behavior source code:
public static class CorrectToggleButtonCheckedEnableBehavior
{
public static bool GetIsActive(ToggleButton toggleButton)
{
return (bool)toggleButton.GetValue(IsActiveProperty);
}
public static void SetIsActive(ToggleButton toggleButton, bool value)
{
toggleButton.SetValue(IsActiveProperty, value);
}
public static readonly DependencyProperty IsActiveProperty =
DependencyProperty.RegisterAttached("IsActive", typeof(bool), typeof(CorrectToggleButtonCheckedEnableBehavior),
new UIPropertyMetadata(false, OnIsActiveChanged));
static void OnIsActiveChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
{
var toggleButton = (ToggleButton)d;
if (GetIsActive(toggleButton))
{
toggleButton.IsEnabledChanged += new DependencyPropertyChangedEventHandler(ToggleButton_IsEnabledChanged);
}
else
{
toggleButton.IsEnabledChanged -= new DependencyPropertyChangedEventHandler(ToggleButton_IsEnabledChanged);
}
}
static void ToggleButton_IsEnabledChanged(object sender, DependencyPropertyChangedEventArgs e)
{
var toggleButton = (ToggleButton)sender;
if (toggleButton.IsEnabled && (toggleButton.IsChecked ?? false))
{
Invalidate(toggleButton);
}
}
static void Invalidate(ToggleButton toggleButton)
{
var controlTemplate = toggleButton.Template;
toggleButton.Template = null;
toggleButton.Template = controlTemplate;
}
}

Is it possible to set the state of a radioButton into IsChecked = false upon second click?

I have 4 radio buttons in one group.
Upon clicking the radio button the state will be changed into IsChecked = true.
I want to change the state of the radio button to IsChecked = false when I clicked a checked radio button.
Is this possible in XAML?
You need to keep track of the checked status of four radio buttons in the group. Every time, any of the radio button is clicked you need to update the status to most recent. Following is the code that you can try.
XAML Code....
<UserControl x:Class="SilverlightApplication1.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"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="400">
<StackPanel x:Name="LayoutRoot" Background="White">
<RadioButton GroupName="LotOfFour" Tag="0" Click="RadioButton_Click" Checked="RadioButton_Checked" Unchecked="RadioButton_Unchecked"/>
<RadioButton GroupName="LotOfFour" Tag="1" Click="RadioButton_Click" Checked="RadioButton_Checked" Unchecked="RadioButton_Unchecked"/>
<RadioButton GroupName="LotOfFour" Tag="2" Click="RadioButton_Click" Checked="RadioButton_Checked" Unchecked="RadioButton_Unchecked"/>
<RadioButton GroupName="LotOfFour" Tag="3" Click="RadioButton_Click" Checked="RadioButton_Checked" Unchecked="RadioButton_Unchecked"/>
</StackPanel>
</UserControl>
Code behind...
public partial class MainPage : UserControl
{
private Boolean[] _ischecked;
public MainPage()
{
InitializeComponent();
Loaded += new RoutedEventHandler(MainPage_Loaded);
}
void MainPage_Loaded(object sender, RoutedEventArgs e)
{
_ischecked = new Boolean[] { false, false, false, false };
}
private void RadioButton_Checked(object sender, RoutedEventArgs e)
{
MessageBox.Show("Checked");
}
private void RadioButton_Unchecked(object sender, RoutedEventArgs e)
{
MessageBox.Show("Unchecked");
}
private void RadioButton_Click(object sender, RoutedEventArgs e)
{
RadioButton rbSource = sender as RadioButton;
if ((rbSource != null) && (rbSource.IsChecked == true))
{
try
{
Int32 index = Int32.Parse(rbSource.Tag.ToString());
Boolean isSourceChecked = _ischecked[index];
// Now reset all to false, source will be set accordingly in ifelse block.
_ischecked[0] = false;
_ischecked[1] = false;
_ischecked[2] = false;
_ischecked[3] = false;
if (isSourceChecked == true)
{
_ischecked[index] = false;
rbSource.IsChecked = false;
}
else
{
_ischecked[index] = true;
}
}
catch (Exception) { }
}
}
}
Do it like this in the Checked and Unchecked events of the radiobutton
public bool Ischecked { get; set; }
private void RadioButton_Checked(object sender, RoutedEventArgs e)
{
Ischecked = true;
}
private void RadioButton_Unchecked(object sender, RoutedEventArgs e)
{
Ischecked = false;
}

Set events for new UIelements on runtime

I'm kinda confused with some problem, I'm doing a project where the user should be able to design questions with radio buttons, combo box, etc (kinda like toolbox from VS10 to design your XAML).
So far I can drag and drop an UIElement that I previously created, problem comes when the user creates a new element from my toolbox, I can't find the way to make that new UIElement to get the same events from my previosly created UIElement. Take a look at the code
<Window x:Class="WpfApplication1.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Grid>
<Canvas Height="190" HorizontalAlignment="Left" Margin="158,41,0,0" Name="canvas1" VerticalAlignment="Top" Width="322" AllowDrop="True">
<Button Content="PROBANDO" Height="23" Name="button" Width="75" Canvas.Left="113" Canvas.Top="43" PreviewMouseDown="button_PreviewMouseDown" PreviewMouseMove="button_PreviewMouseMove" MouseUp="button_MouseUp" IsEnabled="True" />
<TextBlock Canvas.Left="99" Canvas.Top="147" Height="23" Name="textBlock" Text="" Width="107" />
</Canvas>
<ListBox Height="190" Name="listBox" Width="126" Margin="12,41,365,80" >
<ListBoxItem Content="Radio Button" Selected="radio_Selected" Name="radio" />
<ListBoxItem Content="Text" Selected="text_Selected" Name="text" />
<ListBoxItem Content="Combo Box" Name="combo" Selected="combo_Selected" />
</ListBox>
</Grid>
</Window>
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
}
Point p;
private void button_MouseUp(object sender, MouseButtonEventArgs e)
{
button.ReleaseMouseCapture();
}
private void button_PreviewMouseDown(object sender, MouseButtonEventArgs e)
{
button.CaptureMouse();
p = e.GetPosition(canvas1);
}
private void button_PreviewMouseMove(object sender, MouseEventArgs e)
{
Point x = e.GetPosition(canvas1);
if (e.LeftButton == MouseButtonState.Pressed)
{
Canvas.SetLeft(button, Canvas.GetLeft(button) + (x.X - p.X));
Canvas.SetTop(button, Canvas.GetTop(button) + (x.Y - p.Y));
}
p = x;
}
private void generic_PreviewMouseDown(UIElement sender, MouseEventArgs e)
{
Point x = e.GetPosition(canvas1);
if (e.LeftButton == MouseButtonState.Pressed)
{
Canvas.SetLeft(sender, Canvas.GetLeft(sender) + (x.X - p.X));
Canvas.SetTop(sender, Canvas.GetTop(sender) + (x.Y - p.Y));
}
p = x;
}
private void radio_Selected(object sender, RoutedEventArgs e)
{
RadioButton newRadio = new RadioButton();
canvas1.Children.Add(newRadio);
newRadio.PreviewMouseDown += generic_PreviewMouseDown(newRadio,?????);
textBlock.Text = listBox.SelectedIndex.ToString();
}
private void text_Selected(object sender, RoutedEventArgs e)
{
TextBox newText = new TextBox();
canvas1.Children.Add(newText);
textBlock.Text = (String)listBox.SelectedIndex.ToString();
}
private void combo_Selected(object sender, RoutedEventArgs e)
{
Console.Write("Combo");
textBlock.Text = (String)listBox.SelectedIndex.ToString();
}
}
Thanks!
If all you want to do is handle the mouse down on the new RadioButton, change this line:
newRadio.PreviewMouseDown += generic_PreviewMouseDown(newRadio,?????);
To this:
newRadio.PreviewMouseDown += generic_PreviewMouseDown;
Edit
And then you need to change the generic_PreviewMouseDown to the following:
private void generic_PreviewMouseDown(object sender, MouseEventArgs e)
{
UIElement elem = sender as UIElement;
Point x = e.GetPosition(canvas1);
if (e.LeftButton == MouseButtonState.Pressed)
{
Canvas.SetLeft(elem, Canvas.GetLeft(elem) + (x.X - p.X));
Canvas.SetTop(elem, Canvas.GetTop(elem) + (x.Y - p.Y));
}
p = x;
}

XAML Trigger Auto-tab when MaxLength is Reached

How can I incorporate an auto-tab when the MaxLength property is reached into a XAML Trigger, DataTrigger, PropertyTrigger, Style.Trigger, etc. Below are two such options for how I have already accomplished this with a TextBox via code-behind. I'm looking to apply it in a XAML style as well. Thanks.
XAML:
<TextBox x:Name="MyTextBox"
Text="{Binding Path=MyProperty}"
Style="{StaticResource TextBoxStyle}"
MaxLength="5"
TextChanged="MyTextBox_TextChanged">
</TextBox>
Code-Behind for WPF:
private void MyTextBox_TextChanged(object sender, TextChangedEventArgs e)
{
if (MyTextBox.Text.Length == MyTextBox.MaxLength)
{
Keyboard.Focus(NextTextBox);
}
}
private void MyTextBox_PreviewKeyDown(object sender, KeyEventArgs e)
{
// Auto-tab when maxlength is reached
if (((TextBox)sender).MaxLength == ((TextBox)sender).Text.Length)
{
// move focus
var ue = e.OriginalSource as FrameworkElement;
e.Handled = true;
ue.MoveFocus(new TraversalRequest(FocusNavigationDirection.Next));
}
}
}
simply do this in your Shell.xaml
<Style TargetType="TextBox">
<EventSetter Event="TextChanged" Handler="MyTextBox_PreviewKeyDown"/>
</Style>
and in your shell.xaml.cs
private void MyTextBox_PreviewKeyDown(object sender, KeyEventArgs e)
{
// Auto-tab when maxlength is reached
if (((TextBox)sender).MaxLength == ((TextBox)sender).Text.Length)
{
// move focus
var ue = e.OriginalSource as FrameworkElement;
e.Handled = true;
ue.MoveFocus(new TraversalRequest(FocusNavigationDirection.Next));
}
}
}

Resources