この手順では、追加した C1ColorPicker コントロールに機能を提供するためのコードを UWP アプリケーションに追加します。既に前の手順でユーザーインタフェースを設計したので、次の手順を実行して機能を追加します。

1. デザインビューで、C1ControlPicker1 を 1 回クリックして選択し、［プロパティ］ウィンドウに移動します。
2. ［プロパティ］ウィンドウで、［イベント］アイコンを選択し、SelectedColorChanged イベントを見つけ、テキスト領域をダブルクリックします。
3. これで、選択したコントロールのコードビュー（MainPage.xaml.cs）が開き、イベントハンドラが C1ColorPicker1_SelectedColorChanged として作成されます。
4. コードの先頭に次の import 文が追加されていることを確認します。
   

   Visual Basic	コードのコピー
   Imports C1.Xaml Imports C1.Xaml.Extended

   
   

   C#	コードのコピー
   using C1.Xaml; using C1.Xaml.Extended;

     
5. グラデーション値を更新し、C1ColorPicker1 の SelectedColorChanged イベントハンドラをサブスクライブするには、コードビューで MainPage のコンストラクタの直後に次のコードを追加します（MainPage.xaml.cs）。
   

   Visual Basic	コードのコピー
   Private Sub UpdateGradient() If C1ColorPicker1 IsNot Nothing And C1ColorPicker2 IsNot Nothing Then Me.col1.Color = Me.C1ColorPicker1.SelectedColor Me.col2.Color = Me.C1ColorPicker2.SelectedColor End If End Sub Private Sub C1ColorPicker1_SelectedColorChanged(sender As Object, e As PropertyChangedEventArgs(Of Windows.UI.Color))Handles C1ColorPicker1.SelectedColorChanged UpdateGradient() End Sub

   
   

   C#	コードのコピー
   void UpdateGradient() { if (C1ColorPicker1 != null & C1ColorPicker2 != null) { this.col1.Color = this.C1ColorPicker1.SelectedColor; this.col2.Color = this.C1ColorPicker2.SelectedColor; } } private void C1ColorPicker1_SelectedColorChanged(object sender, C1.Xaml.PropertyChangedEventArgs<Windows.UI.Color> e) { UpdateGradient(); }

6. 手順 1、2、および 3 を繰り返して、2 つめの ColorPicker コントロール（C1ColorPicker2）に SelectedColorChanged イベントを追加してサブスクライブします。イベントが作成されたら、次のようにコードでグラデーション値を更新します。
   

   Visual Basic	コードのコピー
   Private Sub C1ColorPicker2_SelectedColorChanged(sender As Object, e As PropertyChangedEventArgs(Of Windows.UI.Color)) Handles C1ColorPicker2.SelectedColorChanged UpdateGradient() End Sub

   
   

   C#	コードのコピー
   private void C1ColorPicker2_SelectedColorChanged(object sender, PropertyChangedEventArgs<Windows.UI.Color> e) { UpdateGradient(); }

これで、UWP アプリケーションにコードを追加して、追加した ColorPicker コントロールに機能を提供できました。次の手順では、このアプリケーションを実行し、実行時のコントロールの機能を確認します。