私の最初のWPFプロジェクトで、独自の展開可能/折り畳み可能なメニュー(創造的にはExpandingMenu
と呼ばれる)を作成しようとしています。私はすでに2行のGrid
(行1はコントロールを折りたたんで展開するためのボタンで、行2はStackPanel
を回転させるためのボタンで、ToggleButtons
は現在スタックしています)からなるユーザーコントロールが1つあります。私の回転ボタンのために、私はちょうど彼ら自身もUserControls
にすることに決めました。StackPanel内のコントロールの回転
ボタン(私はExpandingMenuButtons
それらを呼んでいる)私は取得した後、私はこれらのボタンにいくつかの余分なカスタムロジックを追加することもできますので、(私はこのようにそれをやってと思っていた1x1 Grid
でToggleButton
すぎません標準的な振る舞いが整理された)。私はそれらを私のメニューコントロールに正常に追加できます。私はのGrid
で回転させることさえできます。
しかし、実際にはわかるように、回転するとスイングします。これは彼らが高すぎるだけでなく、遠くまで拡大する可能性もあります。
これは、私が現在行っていることですが、回転を試みる前に、期待どおりに動作しています。
これは私が達成しようとしている(塗料の魔法を使って編集した)ものです。私は1つのボタンを回転させたときに、私は何ができるか...
を私は私のMenuコントロールでこの正しい動作を(日焼けエリア)を得ることができますが、私はテスト目的のために、その間に拡大/契約イベントを台無しにしました(私が以前に述べたように、私は自分のテストが目的のためにいくつかの動作を混乱させているので、各ボタンはクリックで回転するように設定されています。ご覧のように、このボタンは元の場所から振り向いています。上のボタンが部分的に/完全に見えなくなります。代わりに、私は彼らが適切な場所に回転してほしいです。私は1つが正しく動作し得れば、私は私が、なぜ私は物事をこのようにしようとしているのと同じ方法で、行動残りの部分を取得するのは簡単だろうと想定。..
マイボタンのコードは以下の通りです:
<UserControl x:Class="App.Controls.ExpandingMenuButton"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="clr-namespace:App.Controls"
mc:Ignorable="d"
d:DesignHeight="30" d:DesignWidth="100">
<Grid Name="ButtonGrid" Height="30">
<ToggleButton Name="MenuButton" Background="Aqua" BorderThickness="0 0 0 1" Click="MenuButton_Click" Content="TEST"></ToggleButton>
</Grid>
</UserControl>
これまでExpandingMenuButton.xaml.csで唯一の "本物" のコード:
private void MenuButton_Click(object sender, RoutedEventArgs e)
{
//I know this is not practical, it is used for quick testing.
ButtonGrid.RenderTransform = new RotateTransform(-90);
}
これまでの私のメニューコード:
<UserControl x:Class="App.Controls.ExpandingMenu"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="clr-namespace:App.Controls"
mc:Ignorable="d"
Name="ucExpandingMenu"
MinWidth="32"
d:DesignHeight="300" d:DesignWidth="100">
<UserControl.Resources>
<SolidColorBrush x:Key="BackColor" Color="PeachPuff"/>
<!-- This style is used for buttons, to remove the WPF default 'animated' mouse over effect. http://stackoverflow.com/a/4182205/2957232 -->
<Style x:Key="ExpandButtonStyle" TargetType="Button">
<Setter Property="OverridesDefaultStyle" Value="True"/>
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="Button">
<Border Name="border"
BorderThickness="0 0 0 1"
BorderBrush="Black"
Background="{TemplateBinding Background}">
<ContentPresenter HorizontalAlignment="Center" VerticalAlignment="Center" />
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter TargetName="border" Property="BorderBrush" Value="Black" />
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</UserControl.Resources>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition />
</Grid.RowDefinitions>
<StackPanel Name="MenuPanel" Width="100" HorizontalAlignment="Left" Background="{DynamicResource BackColor}" Grid.Row="1">
<!--Contents will go here-->
</StackPanel>
<Button Style="{StaticResource ExpandButtonStyle}" Width="100" Height="32" FontSize="18" VerticalAlignment="Center" HorizontalAlignment="Stretch" Panel.ZIndex="1" Background="{DynamicResource BackColor}" BorderThickness="0" Click="Button_Click" Content="»"></Button>
<Button Name="DummyFocus" Panel.ZIndex="0" Height="0" Width="0"></Button>
</Grid>
</UserControl>
そして再びこれまでのところ、このクラスでは、唯一の「本物の」コード:
private void Button_Click(object sender, RoutedEventArgs e)
{
MenuPanel.Children.Add(new ExpandingMenuButton("TEST ITEM"));
}
WPFの知識の私の不足を言い訳してください、私もそこに私Winformsの、の世界から来しようとしていますこのようなことについては知識が不足しています。私はコードがちょっと面白いように見えるが、うまくいけば、私がここで何をしているのかをイメージが示すことを願っているこれまでは、グリッドとHorizontalAlignmentが「Left」に設定されたダミーウィンドウでこれをテストしています。何もない。
あなたは 'TabControl'を試して、自分のニーズに合わせてカスタマイズすることができます。それは 'TabStripPlacement'プロパティを持っています。 – AnjumSKhan
もしあなたが 'StackPanel'を使うことに決めたら、個々の要素ではなく、' StackPanel'(水平に設定)全体を回転させることをお勧めします。具体的な助けが必要な場合は、これまでに得られたことを明確に示す良い[mcve]を提供してください。 –