Как определить элементы WPF для перекрытия строки сетки при изменении размера во время выполнения? - PullRequest
Новая
       35

Как определить элементы WPF для перекрытия строки сетки при изменении размера во время выполнения?

0 голосов
/ 29 марта 2019

Я использую пакет Mahapps.Metro и иконки в этом небольшом проекте. Моя цель в основном узнать о WPF и современном дизайне пользовательского интерфейса. Я использую 3-х рядную сетку. В первом ряду у меня есть элемент панели инструментов, в который я поместил три плитки (из элементов управления Mahapps). И я добавил эффекты, поэтому, когда я перемещаю мышь над плиткой, она плавно меняет размер до 100x100.

Теперь, когда плитки делают это, строка сетки просто обрезает дно. Когда я устанавливаю высоту строки сетки на «авто», размер строки изменяется вместе с плиткой. Но он перемещает все остальные элементы в других строках.

Мое желание состоит в том, чтобы размер плиток изменялся, не затрагивая что-либо еще, просто перекрывая нижеследующие элементы. Как и в стандартном меню «Файл / Редактировать / Поиск ...».

Вот мой XAML для этого. «Controls» - это средство доступа к Mahapps.Metro Controls. 

    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition />
        </Grid.ColumnDefinitions>
        <Grid.RowDefinitions>
            <RowDefinition Height="40" /> <!--Menubar-->
            <RowDefinition Height="20"/> <!--Where-am-I-Bar-->
            <RowDefinition Height="*" /> <!--Content-->
        </Grid.RowDefinitions>

        <ToolBarTray Grid.Column="0" Grid.Row="0">
            <ToolBarTray.Resources>
                <Style TargetType="Controls:Tile">
                    <Style.Triggers>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Trigger.EnterActions>
                                <BeginStoryboard>
                                    <Storyboard>
                                        <DoubleAnimation Duration="0:0:0.175" To="100" Storyboard.TargetProperty="Height">
                                            <DoubleAnimation.EasingFunction>
                                                <CubicEase EasingMode="EaseOut" />
                                            </DoubleAnimation.EasingFunction>
                                        </DoubleAnimation>
                                    </Storyboard>
                                </BeginStoryboard>
                            </Trigger.EnterActions>
                            <Trigger.ExitActions>
                                <BeginStoryboard>
                                    <Storyboard>
                                        <DoubleAnimation Duration="0:0:0.075" To="30" Storyboard.TargetProperty="Height" />
                                    </Storyboard>
                                </BeginStoryboard>
                            </Trigger.ExitActions>
                        </Trigger>
                    </Style.Triggers>
                    <Setter Property="Height" Value="30" />
                    <Setter Property="Width" Value="100" />
                    <Setter Property="TitleFontSize" Value="12" />
                </Style>
            </ToolBarTray.Resources>
            <ToolBar >
                <StackPanel Orientation="Horizontal">
                    <Controls:Tile Title="2019-03" VerticalAlignment="Top" VerticalTitleAlignment="Center" HorizontalTitleAlignment="Center"/>
                    <Controls:Tile Title="2019-02" VerticalAlignment="Top" VerticalTitleAlignment="Center" HorizontalTitleAlignment="Center"/>
                    <Controls:Tile Title="2019-01" VerticalAlignment="Top" VerticalTitleAlignment="Center" HorizontalTitleAlignment="Center"/>
                </StackPanel>
            </ToolBar>
        </ToolBarTray>


        <TextBlock Grid.Column="0" Grid.Row="1" Text="Test123" />
    </Grid>

Надеюсь, вы поможете мне с этим.

Привет, ксола

...