C#、XAML、およびWPFを使用して、多くのデスクトップ電子メールのメッセージコンテンツ用のペインと同様に、メールクライアント。私はそれを完全に隠すことができるようにしたい。そのコンテンツとウィンドウのメインコンテンツとの間でスプリッタをドラッグすることでサイズを変更する必要があります。可能な限り宣言的に実装されたXAMLのサイズ変更可能な隠ぺいウィンドウ
非常に宣言的に実装することができましたが、コードビハインドがサポートされている操作に焦点を当て、使用されるUIコンポーネントの状態を直接操作しない宣言的実装の明快さを犠牲にすることなく修正できないバグがあります。
- レイアウト全体は3行目のグリッドで、中央の行には
GridSplitter
が含まれています。 PaneVisible
という名前の依存関係プロパティは、ペイン内のGridSplitter
およびContentControl
の見た目に双方向で結びついています。PaneVisible == false
の場合、Height
がAuto
に設定されているため、中央の行が自動的に折りたたまれます。最下行のHeight
は、DataTrigger
を介して0
に設定されています。
ちょうどPaneVisible
をトグルすると、希望どおりに動作します。 GridSplitter
をドラッグした後、最後の行は決して崩壊することはありません、これは望ましくありません。 RowDefinition.Height
がローカル値を取得し、スタイルで指定された値(DataTrigger
を含む)が使用されなくなった(オーバーライドされている)ことがわかりました。
私は別の依存関係プロパティPaneHeight
を導入することについて考えたがPaneVisible == false
、RowDefinition.Height
が0であるとPaneHeight
は元の値を保持したときになるように、私はバインディングを設定できませんでした。その価値を絶対的に唯一の選択肢に設定しているのか、それとも私の問題を解決するための宣言的な方法がありますか?
全体的なデザインに関する提案も歓迎します。 UIプログラミングの経験はほとんどありません。
マークアップ:Application.Resources
で
<Window x:Class="WpfTestingApplication.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:WpfTestingApplication"
Title="MainWindow" Height="350" Width="525">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition MinHeight="20" Height="*" />
<RowDefinition Height="Auto" />
<RowDefinition>
<RowDefinition.Style>
<Style TargetType="RowDefinition">
<Setter Property="Height" Value="100" />
<Style.Triggers>
<DataTrigger Binding="{Binding RelativeSource={RelativeSource AncestorType=local:MainWindow}, Path=PaneVisible}" Value="false">
<Setter Property="Height" Value="0" />
</DataTrigger>
</Style.Triggers>
</Style>
</RowDefinition.Style>
</RowDefinition>
</Grid.RowDefinitions>
<ToggleButton Grid.Column="0" Click="TogglePane_Click">Toggle pane</ToggleButton>
<GridSplitter Grid.Row="1" Height="9" HorizontalAlignment="Stretch" Visibility="{Binding RelativeSource={RelativeSource AncestorType=local:MainWindow}, Path=PaneVisible, Converter={StaticResource BoolToVis}}" />
<ContentControl Grid.Row="2" Name="Pane" Visibility="{Binding RelativeSource={RelativeSource AncestorType=local:MainWindow}, Path=PaneVisible, Converter={StaticResource BoolToVis}}">
<TextBlock>Yadayada</TextBlock>
</ContentControl>
</Grid>
</Window>
、私は<BooleanToVisibilityConverter x:Key="BoolToVis" />
を追加しました。
コードビハインド:
using System;
using System.Windows;
namespace WpfTestingApplication
{
public partial class MainWindow : Window
{
public static readonly DependencyProperty PaneVisibleProperty =
DependencyProperty.Register("PaneVisible", typeof(bool), typeof(MainWindow), new PropertyMetadata(false));
public bool PaneVisible
{
get { return (bool)GetValue(PaneVisibleProperty); }
set { SetValue(PaneVisibleProperty, value); }
}
public MainWindow()
{
InitializeComponent();
}
private void TogglePane_Click(object sender, RoutedEventArgs e)
{
PaneVisible = !PaneVisible;
}
}
}