Home > front end >  DragMove() will make the Border with cornerRadius lose its mouseover trigger state?
DragMove() will make the Border with cornerRadius lose its mouseover trigger state?

Time:06-17

I have created a borderless window with rounded corners, and added the drag event and a trigger to it. Here is the simple code:

<Window x:Class="DebugTest.MainWindow"
        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:local="clr-namespace:DebugTest"
        mc:Ignorable="d" Height="200" Width="200"
        AllowsTransparency="True" WindowStyle="None" Background="Transparent">
    <Border x:Name="MainBorder" CornerRadius="15" Background="White" BorderBrush="Black" BorderThickness="1">
        <Grid>
            <Grid.Style>
                <Style TargetType="Grid">
                    <Setter Property="Visibility" Value="Hidden" />
                    <Style.Triggers>
                        <DataTrigger Binding="{Binding ElementName=MainBorder,Path=IsMouseOver}" Value="True">
                            <Setter Property="Visibility" Value="Visible"/>
                        </DataTrigger>
                    </Style.Triggers>
                </Style>
            </Grid.Style>
            <Button Content="x" HorizontalAlignment="Right" VerticalAlignment="Top" 
                    Margin="5" Height="20" Width="20" Click="Button_Click"/>
        </Grid>
    </Border>
</Window>
        public MainWindow()
        {
            InitializeComponent();
        }
        protected override void onm ouseLeftButtonDown(MouseButtonEventArgs e)
        {
            base.OnMouseLeftButtonDown(e);
            this.DragMove();
        }
        private void Button_Click(object sender, RoutedEventArgs e)
        {
            this.Close();
        }

But when I run the exe file, click on the blank area within the window, the button will appear very obvious flickering situation.

Strangely enough, this situation hardly occurs when debugging in Visual Studio instead of double click the file, and it also doesn't happen while CornerRadius="0".

It looks like it lost the mouseover trigger on click, but I can't think of any good way to avoid flicker appearing, and to satisfy the need for both with rounded corners, draggable, and with trigger.

CodePudding user response:

Well, although I don't know why only rounded corners would cause DragMove() to trigger the MouseLeave event, I circumvented this with background code instead of using xaml trigger.

    <Border x:Name="MainBorder" CornerRadius="15" Background="White" 
            BorderBrush="Black" BorderThickness="1"
            MouseEnter="MainBorder_MouseEnter" MouseLeave="MainBorder_MouseLeave">
        <Grid Visibility="Hidden" x:Name="TriggerBorder">
            <Button Content="x" HorizontalAlignment="Right" VerticalAlignment="Top" 
                    Margin="5" Height="20" Width="20" Click="Button_Click"/>
        </Grid>
    </Border>
        bool dragMoving = false;
        public MainWindow()
        {
            InitializeComponent();
        }        
        private void Button_Click(object sender, RoutedEventArgs e)
        {
            this.Close();
        }       
        protected override void onm ouseLeftButtonDown(MouseButtonEventArgs e)
        {
            base.OnMouseLeftButtonDown(e);
            dragMoving = true;
            this.DragMove();
            dragMoving = false;
        }
        private void MainBorder_MouseEnter(object sender, MouseEventArgs e)
        {
            TriggerBorder.Visibility = Visibility.Visible;
        }

        private void MainBorder_MouseLeave(object sender, MouseEventArgs e)
        {
            if (dragMoving) return;
            TriggerBorder.Visibility = Visibility.Hidden;
        }

Seems to work fine.

  • Related