ViewMakerで生成するWPF/Silverlightコントロール（２０）UserControl編

最後に紹介するコントロールはUserControlです。UserControlは任意のものが利用できるので、ViewMakerで生成したコンテンツをUserControlに貼り付けて利用することももちろんできます。ViewMakerでは困難なレイアウトのViewが必要な場合、一旦コンテンツをViewMakerで生成してUserControlに貼り付けてVisual Studioで微調整などという開発シナリオも有効だと考えています。

UserControlコントロール

ユーザコントロールの指定方法はタイプ名（Type.GetTypeメソッドで解決できる文字列）で行います。

1. TypeName（ユーザコントロールのタイプ名）

WPFサンプルイメージとXAMLコード

<StackPanel Name="UserControl" Orientation="Vertical" DataContext="{Binding Path=UserControl,Mode=OneWay}" 
	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation">
  <ContentControl HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" HorizontalAlignment="Stretch">
    <uc:SampleUserControl xmlns:uc="clr-namespace:ViewMaker.Core.Tests;assembly=ViewMaker.SampleApplication" 
	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" DataContext="{Binding Path=UserControl1,Mode=OneWay}" 
	Name="UserControl1" />
  </ContentControl>
  <ContentControl HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" IsEnabled="{Binding Path=IsEnabled,Mode=OneWay}" 
	HorizontalAlignment="Left">
    <uc:SampleUserControl xmlns:uc="clr-namespace:ViewMaker.Core.Tests;assembly=ViewMaker.SampleApplication" 
	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" DataContext="{Binding Path=UserControl2,Mode=OneWay}" 
	Width="200" Background="Azure" Name="UserControl2" />
  </ContentControl>
  <CheckBox Name="IsEnabled" IsChecked="{Binding Path=IsEnabled, Mode=TwoWay, ValidatesOnExceptions=True, ValidatesOnDataErrors=True}" />
</StackPanel>

SilverlightサンプルイメージとXAMLコード

<StackPanel Name="UserControl" Orientation="Vertical" DataContext="{Binding Path=UserControl,Mode=OneWay}" Margin="5" 
	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation">
  <ContentControl HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" HorizontalAlignment="Stretch">
    <uc:SampleUserControl Name="UserControl1" xmlns:uc="clr-namespace:ViewMaker.Core.Tests;assembly=SilverlightViewMaker.SampleApplication" 
	DataContext="{Binding Path=UserControl1,Mode=OneWay}" />
  </ContentControl>
  <ContentControl HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch" IsEnabled="{Binding Path=IsEnabled,Mode=OneWay}" 
	HorizontalAlignment="Left">
    <uc:SampleUserControl Name="UserControl2" xmlns:uc="clr-namespace:ViewMaker.Core.Tests;assembly=SilverlightViewMaker.SampleApplication" 
	DataContext="{Binding Path=UserControl2,Mode=OneWay}" Width="200" Background="Azure" />
  </ContentControl>
  <CheckBox Name="IsEnabled" IsChecked="{Binding Path=IsEnabled, Mode=TwoWay, ValidatesOnExceptions=True, ValidatesOnDataErrors=True}" />
</StackPanel>

ViewModelコード

[View(ViewControlType.StackPanel)]
[ViewProperty(StackPanelViewControl.Properties.HeaderPosition, LayoutHeaderPosition.Hidden)]
public class UserControlSample : ViewModel
{
    [View(typeof(SampleUserControl))]
    public class SampleUserControlViewModel : ViewModel
    {
        public string Input { get; set; }

        public string Output
        {
            get { return _output; }
            set { _output = value; OnPropertyChanged("Output"); }
        }
        private string _output;

        public ICommand Hello { get { return CreateCommand(() => Output = "Hello " + Input); } }
    }

    [Browsable(true)]
    [ViewProperty(UserControlViewControl.Properties.HorizontalAlignment, LayoutHorizontalAlignment.Stretch)]
    public SampleUserControlViewModel UserControl1 { get; set; }

    [Browsable(true)]
    [ViewProperty(UserControlViewControl.Properties.Width, 200)]
    [ViewProperty(UserControlViewControl.Properties.Background, "Azure")]
    [ViewProperty(UserControlViewControl.Properties.IsEnabled, "IsEnabled")]
    public SampleUserControlViewModel UserControl2 { get; set; }

    public bool IsEnabled
    {
        get { return _isEnabled; }
        set { _isEnabled = value; OnPropertyChanged("IsEnabled"); }
    }
    private bool _isEnabled;

    public UserControlSample()
    {
        UserControl1 = new SampleUserControlViewModel();
        UserControl2 = new SampleUserControlViewModel();
    }
}