Как заставить окна выдвигаться с помощью WPF (выражение Blend 4 и C #) - PullRequest
1 голос
/ 10 сентября 2011

Я пытаюсь выяснить, как соединить окна, чтобы выскользнуть с помощью маленькой кнопки слева или справа от главного окна. Я пытаюсь создать основную форму с двумя подключенными к ней окнами. Для одного из окон, когда пользователь нажимает кнопку в главном окне, оно заставляет окно, скорее, выскользнуть, чем всплыть. Вот где я получил идею http://www.youtube.com/watch?v=CVlSj0yr3rg&feature=related .. Затем пользователь изменяет значение, и главные окна обновляются новой информацией. Честно говоря, я закончил писать весь свой код и получил все, что работает в Windows Forms в Visual Studio 2010 (с всплывающими окнами). Но я думаю сделать более привлекательный графический интерфейс WPF - это путь, плюс мне нравится узнавать об этом. Если у вас есть форумы, учебники или общие ответы, это было бы здорово.

Ответы [ 2 ]

1 голос
/ 10 сентября 2011

ОК, поэтому, судя по видео, вы действительно хотите, чтобы открылся какой-то расширитель, а не окно.Окно - это область с рамкой, а стандартные кнопки и заголовок вверху.

Это можно сделать с помощью сетки с двумя столбцами.Один установлен на Авто ширина, другой установлен на * ширина.В авторазмер вы можете поместить свой расширяющийся контент, а другой - в всегда видимый контент.Простой способ сделать это:

Xaml

<Window
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="clr-namespace:StackOverflow"
    x:Class="MainWindow"
    x:Name="Window"
    Title="MainWindow"
    Width="640" Height="480">
    <Grid x:Name="LayoutRoot">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto" MinWidth="7"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <Grid x:Name="ExpandoGrid"/>
        <Button Content="..." Grid.Column="0" HorizontalAlignment="Right" Margin="0" VerticalAlignment="Center" RenderTransformOrigin="0.5,0.5" Width="6" Height="40" Click="Button_Click"/>
        <Grid x:Name="OtherContentGrid" Grid.Column="1" HorizontalAlignment="Left" Height="100" Margin="-7,0,0,0" VerticalAlignment="Top" Width="100"/>
    </Grid>
</Window>

Кодовый код

Imports System.Collections.ObjectModel
Class MainWindow

    Public Sub New()
        InitializeComponent()
    End Sub

    Private Sub Button_Click(ByVal sender as Object, ByVal e as System.Windows.RoutedEventArgs)
        If Me.ExpandoGrid.Width = 7 Then Me.ExpandoGrid.Width = 200 Else Me.ExpandoGrid.Width = 7
    End Sub
End Class

Это ни в коем случае не полный или лучший способ,Это один из самых простых способов реализации.Лучше было бы использовать ViewModel, который бы обрабатывал состояние расширенной области, а также некоторые анимации, чтобы сделать его плавным переходом.Если вам нужно скользящее поведение, которое выполняется в этом видео, анимация находится там, где она есть.Если вы используете Blend, то у вас есть подходящий инструмент для анимации.

Лично я хотел бы, чтобы у этой модели Windows ViewModel было свойство (давайте назовем его DrawerExpanded as Boolean), с которым настраиваемый Expander должен связать свое свойство IsExpanded.Затем я бы создал открытую анимацию, которая устанавливает ширину содержимого в экспандере, и закрытую анимацию, которая устанавливает ширину равной 0. Кроме того, в каждом из них я бы, вероятно, включил бы настройку видимости и непрозрачности, чтобы сделать эффект лучше ине странноДопустим, расширение анимации устанавливает ширину 350 на 0,5 секунды, видимость видимой на 0,5 секунды, а затем непрозрачность от 0 до 100 от 0,5 до 0,7 секунды.Таким образом, ящик выдвигается, и содержимое быстро исчезает.

Если вам нужен пример кода, возможно, вам придется дать мне несколько минут.

0 голосов
/ 10 апреля 2013

Я бы просто выбрал простой / дружественный способ создания Visual States в Expression Blend. В основном это просто «в состоянии» и «вне состояния», а также InteractionTrigger, который позволяет элементу управления изменять состояние. Это удивительно и очень удобно для пользователя.

Никакого кода позади :) Надеюсь, это поможет вам!

В качестве бонуса вы можете легко добавлять эффекты перехода, как в PowerPoint. Код xaml становится довольно многословным, но работа в Blend позволяет вам использовать IDE для управления всем, что вы добавляете визуально.

Вы даже можете использовать Interaction Trigger для переключения между состояниями видимости других элементов управления вместо записи converters и т. Д.

...