使控件的高度超过其他控件的顶部

时间:2018-11-08 15:43:56

标签: c# .net wpf xaml animation

我有一个自定义控件(CustomButton.cs),当您将鼠标悬停在其上时,它的高度(和宽度)会增加(屏幕截图1)。当前,当控件增长时,其余布局会缩小以提供控件空间来增长(屏幕截图2)。我希望布局保持不变,并且希望控件在其他控件上扩展并重叠,但是我无法实现这一点。

我尝试使用ClipToBounds="False",并且还尝试将控件包装在<Canvas>中,这两个都不允许我的控件与其他控件重叠。我还尝试使用<Popup>,但找不到正确的位置,它一直显示在屏幕外。

有人知道如何使它正常工作吗?

悬停前的自定义控件(屏幕截图1)

Custom control before hover (Screenshot 1)

悬停时的自定义控件(屏幕截图2)

Custom control after hover (Screenshot 2)

MainWindow.xaml

<Window x:Class="Tests.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:Tests"
    mc:Ignorable="d"
    Title="MainWindow" Height="450" Width="800">
<Grid Margin="10">
    <Grid.RowDefinitions>
        <RowDefinition Height="*"></RowDefinition>
        <RowDefinition Height="10"></RowDefinition>
        <RowDefinition Height="Auto"></RowDefinition>
    </Grid.RowDefinitions>
    <Border Grid.Row="0" Background="Beige" BorderBrush="Black" BorderThickness="1" ></Border>
    <StackPanel Grid.Row="2" Orientation="Horizontal">
        <local:CustomButton Margin="0,0,10,0">Text1</local:CustomButton>
        <local:CustomButton>Text2</local:CustomButton>
    </StackPanel>
</Grid>

CustomButton.cs

public class CustomButton : Button
{
    static CustomButton()
    {
        DefaultStyleKeyProperty.OverrideMetadata(typeof(CustomButton), new FrameworkPropertyMetadata(typeof(CustomButton)));
    }

    public CustomButton()
    {
        this.Loaded += OnLoaded;
    }

    private void OnLoaded(object sender, RoutedEventArgs e)
    {
        this.Width = this.ActualWidth;
        this.Height = this.ActualHeight;
    }
}

Generic.xaml

<Style TargetType="{x:Type local:CustomButton}">
    <Setter Property="Background" Value="LightBlue"></Setter>
    <Setter Property="BorderBrush" Value="Black"></Setter>
    <Setter Property="BorderThickness" Value="1"></Setter>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type local:CustomButton}">
                <Border Background="{TemplateBinding Background}"
                        BorderBrush="{TemplateBinding BorderBrush}"
                        BorderThickness="{TemplateBinding BorderThickness}">
                    <TextBlock Text="{TemplateBinding Content}" Padding="5" HorizontalAlignment="Center"></TextBlock>
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsMouseOver" Value="True">
                        <Trigger.EnterActions>
                            <BeginStoryboard>
                                <Storyboard>
                                    <!-- Button increase Width/Height animation -->
                                    <DoubleAnimation Storyboard.TargetProperty="Height" By="20" Duration="0:0:0.1" />
                                    <DoubleAnimation Storyboard.TargetProperty="Width" By="50" Duration="0:0:0.1" />
                                </Storyboard>
                            </BeginStoryboard>
                        </Trigger.EnterActions>
                        <Trigger.ExitActions>
                            <BeginStoryboard>
                                <Storyboard>
                                    <!-- Button decrease Width/Height animation -->
                                    <DoubleAnimation Storyboard.TargetProperty="Height" By="-20" Duration="0:0:0.2" />
                                    <DoubleAnimation Storyboard.TargetProperty="Width" By="-50" Duration="0:0:0.2" />
                                </Storyboard>
                            </BeginStoryboard>
                        </Trigger.ExitActions>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

1 个答案:

答案 0 :(得分:1)

会做类似的事情:

{
    'url': u,
    'proxy': 'http://' + proxy, // proxy in format '1.1.1.1:2'
    'followAllRedirects': true,
    'headers': {
      'Cookie': cookie // cookies recieved from Nightmare executing turned to a string
    }
  }

为您工作?