バージョン

カスタム xamSlider コントロールの作成

始める前に

xamSlider コントロールは、開発者固有のカスタム スライダーを作成するために使用できる複数の基本クラスに関連付けられます。xamSimpleSliderBase および xamRangeSlider クラスを継承できるので、固有のカスタム xamSlider コントロールを作成できます。

このトピックは、Color を値として使用する xamSlider コントロールを作成するために、以下のメソッドをオーバーライドする方法を示します。

  • DoubleToValue

  • ValueToDouble

  • GetParameter

  • SupportsCommand

達成すること

固有の Color xamSlider コントロールを作成します。

次の手順を実行します

  1. 固有のカスタム xamSimpleSliderBase を作成し、それに ColorSlider と名前を付けます。

Visual Basic の場合:

Public Class ColorSlider
    Inherits XamSimpleSliderBase(Of Color)
    Protected Overloads Overrides Function DoubleToValue(ByVal value As
                Double) As Color
        Dim pixel As Integer = CInt(value)
        'int を RGBA 値にシフトします
        Dim B As Byte = CByte((pixel And &HFF))
        pixel >>= 8
        Dim G As Byte = CByte((pixel And &HFF))
        pixel >>= 8
        Dim R As Byte = CByte((pixel And &HFF))
        pixel >>= 8
        ' alpha
        Dim A As Byte = CByte(pixel)
        Return Color.FromArgb(A, R, G, B)
    End Function
    Protected Overloads Overrides Function ValueToDouble(ByVal value As
                 Color) As Double
        Return (value.A << 24 Or value.R << 16 Or value.G << 8 Or value.B)
    End Function
    Protected Overloads Overrides Function GetParameter(ByVal source As
                 CommandSource) As Object
        If TypeOf source.Command Is xamSliderBaseCommandBase Then
            Return (Me)
        End If
        Return (Nothing)
    End Function
    Protected Overloads Overrides Function SupportsCommand(ByVal command As
                 ICommand) As Boolean
        Return (TypeOf command Is xamSliderBaseCommandBase)
    End Function
End Class

C# の場合:

public class ColorSlider : XamSimpleSliderBase<Color>
{
   protected override Color DoubleToValue(double value)
   {
      int pixel = (int)value;
      //int を RGBA 値にシフトします
      byte B = (byte)(pixel & 0xFF); pixel >>= 8;
      byte G = (byte)(pixel & 0xFF); pixel >>= 8;
      byte R = (byte)(pixel & 0xFF); pixel >>= 8;
      byte A = (byte)pixel; // alpha
      return Color.FromArgb(A, R, G, B);
   }
   protected override double ValueToDouble(Color value)
   {
      return value.A << 24 | value.R << 16 | value.G << 8 | value.B;
   }
   protected override object GetParameter(CommandSource source)
   {
      if (source.Command is xamSliderBaseCommandBase)
      {
         return this;
      }
      return null;
   }
   protected override bool SupportsCommand(ICommand command)
   {
      return command is xamSliderBaseCommandBase;
   }
}
  1. カスタム スライダーをページに追加します。以下のプロパティを設定します。

    • x:Name - MyCustomSlider

    • Width - 300

    • Height - 50

    • MinValue - Blue

    • Value - Purple

    • MaxValue - Red

XAML の場合:

<colorSlider:ColorSlider
	x:Name="MyCustomSlider"
	Grid.Row="1"
    Width="300"
	Height="50"
    MinValue="Blue"
	Value="Purple"
	MaxValue="Red"/>
  1. TextBox コントロールをページに追加します。以下のプロパティを設定します。

    • x:Name - MyTextBox

    • Background - {Binding Value, ElementName=MyCustomSlider}

これは TextBox コントロールにカスタム スライダーをバインドする方法で、スライダーのカラー値を変更すると、ここで反映されます。

  • Converter - {Static Resource MyConverter}

スライダーの値を TextBox コントロールの背景に指定するにはコンバーターを使用する必要があります。これがタイプ SolidBrushColor で、値はタイプ Color あるからです。コンバーターのためのコードは以下のとおりです。

XAML の場合:

<TextBox Width="300" Height="100" Grid.Row="0" x:Name="MyTextBox"
    Background={StaticResource MyConverter}/>

Visual Basic の場合:

Public Class BackgroundCoverter
    Implements IValueConverter
    Public Function Convert(ByVal value As
                Object, ByVal targetType As Type, ByVal parameter As Object, ByVal culture As CultureInfo) As Object
        Return New SolidColorBrush(DirectCast(value, Color))
    End Function
    Public Function ConvertBack(ByVal value As
                Object, ByVal targetType As Type, ByVal parameter As Object, ByVal culture As CultureInfo) As Object
        Dim brush As SolidColorBrush = TryCast(value, SolidColorBrush)
        If brush IsNot Nothing Then
            Return brush.Color
        End If
        Return Colors.White
    End Function
End Class

C# の場合:

public class BackgroundCoverter : IValueConverter
{
   public object Convert(object value, Type targetType,
                object parameter, CultureInfo culture)
   {
      return new SolidColorBrush((Color)value);
   }
   public object ConvertBack(object value, Type targetType,
                object parameter, CultureInfo culture)
   {
      SolidColorBrush brush = value as SolidColorBrush;
      if (brush!= null)
      {
         return brush.Color;
      }
      return Colors.White;
   }
}
  1. アプリケーションを保存して実行します。