When drag text and On Mouse hover to drop it into TextBox, increase TextBox size and overlap on the other controls

Question

I want to increase the size of a TextBox Control whenever the user drag a node from Treeview control and hovers the mouse over the TextBox. The size increase should not readjust the other controls, rather the current control should overlap the neighboring controls.

I tried to implement the code WPF: On Mouse hover on a particular control, increase its size and overlap on the other controls

but it doesn't work when hover on TextBox and left mouse button is pressed for dragged text.

<ItemsControl Margin="50">
        <ItemsControl.Resources>
            <Style x:Key="ScaleStyle" TargetType="TextBox">
                <Style.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Setter Property="Grid.ZIndex" Value="1"/>
                        <Setter Property="RenderTransform">
                            <Setter.Value>
                                <ScaleTransform ScaleX="1.1" ScaleY="1.1"/>
                            </Setter.Value>
                        </Setter>
                    </Trigger>
                </Style.Triggers>
            </Style>
        </ItemsControl.Resources>
</ItemsControl>

You might want to subscribe to the [DragEnter](https://learn.microsoft.com/en-us/dotnet/api/system.windows.forms.control.dragenter?view=netframework-4.8) event and assign the style manually in code behind. — Nico Schertler, Jul 19 '19 at 21:19
But I want this behavior not to be in specific text box control in the window. I mean implement it in all TextBox controls. — xamo, Jul 19 '19 at 21:27
"*Doesn't work*" is not a proper problem description. At least show what you have tried. — Nico Schertler, Jul 20 '19 at 01:25

score 0 · Answer 1 · answered Jul 20 '19 at 07:46

Approach from a different angle. Use the code behind to handle left click and drag.

Pseudo code... If hover over textbox.text ==true

Textbox size = 300;

Then check the Grid location of the textbox. It should be allowed to columnspan over the other columns, while the rest of the controls stay fixed in their grid.row and grid.column locations.

score 0 · Accepted Answer · answered Jul 20 '19 at 16:15

Here is a small sample application. Contrary to my comment, we need the PreviewDragEnter event since the text box already has Drag/Drop support. In Window_Loaded, the application registers the event handlers. Then, in TextBox_PreviewDragEnter, the new style is set manually. We also store the old z-index to allow restoring it in TextBox_PreviewDragLeave.

<Window x:Class="WpfApp1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Height="350" Width="525" Loaded="Window_Loaded">
    <StackPanel Margin="8">
        <TextBox/>
        <TextBox/>
        <TextBox/>
        <TextBox/>
    </StackPanel>
</Window>

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
    }

    //From https://stackoverflow.com/a/978352/1210053
    public static IEnumerable<T> FindVisualChildren<T>(DependencyObject depObj) where T : DependencyObject
    {
        if (depObj != null)
        {
            for (int i = 0; i < VisualTreeHelper.GetChildrenCount(depObj); i++)
            {
                DependencyObject child = VisualTreeHelper.GetChild(depObj, i);
                if (child != null && child is T)
                {
                    yield return (T)child;
                }

                foreach (T childOfChild in FindVisualChildren<T>(child))
                {
                    yield return childOfChild;
                }
            }
        }
    }

    private void Window_Loaded(object sender, RoutedEventArgs e)
    {
        foreach (var txt in FindVisualChildren<TextBox>(this))
        {
            txt.PreviewDragEnter += TextBox_PreviewDragEnter;
            txt.PreviewDragLeave += TextBox_PreviewDragLeave;
            txt.PreviewDrop += TextBox_PreviewDragLeave;
        }

    }

    private Dictionary<TextBox, int> oldZIndex = new Dictionary<TextBox, int>();

    private void TextBox_PreviewDragEnter(object sender, DragEventArgs e)
    {
        var txt = (TextBox)sender;
        oldZIndex.Add(txt, Panel.GetZIndex(txt));
        Panel.SetZIndex(txt, 1);
        var scaleTransform = new ScaleTransform(1.1, 1.1, txt.ActualWidth / 2, txt.ActualHeight / 2);
        txt.RenderTransform = scaleTransform;
    }

    private void TextBox_PreviewDragLeave(object sender, DragEventArgs e)
    {
        var txt = (TextBox)sender;
        txt.RenderTransform = null;
        Panel.SetZIndex(txt, oldZIndex[txt]);
        oldZIndex.Remove(txt);
    }             
}

Can you guide me with some links to learn more about what you have did. — xamo, Jul 22 '19 at 19:47
What part exactly? It is really just subscribing to the event and applying the style from your question. — Nico Schertler, Jul 22 '19 at 20:52
Parts of create complex Generics,DependencyObject,VisualTree — xamo, Jul 22 '19 at 22:24

When drag text and On Mouse hover to drop it into TextBox, increase TextBox size and overlap on the other controls

2 Answers2