ネタ元：http://blogs.wankuma.com/naka/archive/2008/04/02/131188.aspx
ということで頑張ってみた。
すぐに出来るだろうと思ってたらできないorz
まず、ComboBoxのテンプレートをどうやればいいのかさっぱりわからず。
MSDNを見てみるとComboBoxの例が書いてあったので、それをある程度拝借してComboBoxの見た目をある程度自由に変えることが出来るようになった。
そして、次に躓いたのがPopupのリサイズ…
これはやり方がわからんかったけど、調べてみるとThumbみたいなコントロールを置いて、そいつのドラッグイベントで大きさかえるとそれっぽいとの情報をゲット。
早速真似てみた。
まずはXAML側。
<Window x:Class="WpfResizeCombo.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Window1" Height="300" Width="300">
<Window.Resources>
<ControlTemplate x:Key="comboBoxTemplate" TargetType="{x:Type ComboBox}">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions>
<ContentPresenter Content="{TemplateBinding SelectionBoxItem}"/>
<ToggleButton Grid.Column="2" Name="ToggleButton"
Content="▼"
Focusable="false"
IsChecked="{Binding Path=IsDropDownOpen,Mode=TwoWay,RelativeSource={RelativeSource TemplatedParent}}"
ClickMode="Press"></ToggleButton>
<Popup Name="Popup"
Placement="Bottom"
IsOpen="{TemplateBinding IsDropDownOpen}"
Focusable="False"
PopupAnimation="Slide" Width="100" Height="100">
<Border BorderBrush="Black" BorderThickness="1" Background="White">
<DockPanel>
<Thumb DockPanel.Dock="Bottom" Width="16" Height="16"
HorizontalAlignment="Right" VerticalAlignment="Bottom"
DragStarted="Thumb_DragStarted" DragDelta="Thumb_DragDelta" DragCompleted="Thumb_DragCompleted"/>
<StackPanel IsItemsHost="True" />
</DockPanel>
</Border>
</Popup>
</Grid>
</ControlTemplate>
</Window.Resources>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<ComboBox Template="{StaticResource comboBoxTemplate}">
<ComboBoxItem Content="項目1" Selector.IsSelected="True"/>
<ComboBoxItem Content="項目2" />
</ComboBox>
</Grid>
</Window>
そして、WindowのC#のコードにPopupの右下のThumbをドラッグしたときのサイズ変更のコードを書く。
using System.Diagnostics;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Controls.Primitives;
using System.Windows.Input;
namespace WpfResizeCombo
{
public partial class Window1 : Window
{
public Window1()
{
InitializeComponent();
}
private void Thumb_DragStarted(object sender, System.Windows.Controls.Primitives.DragStartedEventArgs e)
{
var thumb = sender as Thumb;
thumb.Cursor = Cursors.Hand;
}
private void Thumb_DragDelta(object sender, System.Windows.Controls.Primitives.DragDeltaEventArgs e)
{
var thumb = sender as Thumb;
var popup = ((thumb.Parent as FrameworkElement).Parent as Border).Parent as Popup;
Debug.WriteLine(popup);
double yadjust = popup.Height + e.VerticalChange;
double xadjust = popup.Width + e.HorizontalChange;
Debug.WriteLine(yadjust);
Debug.WriteLine(xadjust);
if ((xadjust >= 0) && (yadjust >= 0))
{
popup.Width = xadjust;
popup.Height = yadjust;
}
}
private void Thumb_DragCompleted(object sender, System.Windows.Controls.Primitives.DragCompletedEventArgs e)
{
var thumb = sender as Thumb;
thumb.Cursor = null;
}
}
}
これで、一応リサイズできるコンボボックスになった…
ComboBoxのPopup表示直後
リサイズしてみた
けどかっこ悪い点が２つある。
- WindowにComboBoxのサイズ変更のコードが入っている
- ComboBoxのPopupのサイズの初期値が固定の100, 100になってる
１は、リサイズ可能にするコントロールあたりを作成すれば解決しそう。
２はもリサイズ可能にするようなコントロールをうまく作れば解決するかなぁ…？
とりあえず出来そうだというところまでわかったのでOK！！
改良とかは時間をみてやっていこう。（もしくは誰かがしてくれる？？）