2
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

【WPF】既存のコントロールをベースにオリジナルのコントロールを作ってみる

Posted at

実はめちゃくちゃ簡単にできる

まずは適当にWPFプロジェクトを作成します。
今回はTextBoxを例にして進めていくので、プロジェクト名は「ExtendTextBox」としました。英語的に正しいかは知りません。

親の顔より見たテンプレートをVS君が生成してくれるので……

MainWindow.xaml.cs
namespace ExtendTextBox {
    /// <summary>
    /// MainWindow.xaml の相互作用ロジック
    /// </summary>
    public partial class MainWindow : Window {
        public MainWindow() {
            InitializeComponent();
        }
    }
}

既存コントロールを継承したクラスを追記してあげます。

MainWindow.xaml.cs
namespace ExtendTextBox {
    /// <summary>
    /// MainWindow.xaml の相互作用ロジック
    /// </summary>
    public partial class MainWindow : Window {
        public MainWindow() {
            InitializeComponent();
        }
    }
    
    //追記ここから
    public class SuperUltraHyperCoooooooolTextBox : TextBox {

    }
    //追記ここまで
}

とってもクールなクラス名です。余談になりますが、C#のクラス名は512文字が上限らしいです。

一旦ビルドしてからXAMLの編集画面に行くと……
2022-10-15_06h03_13.png

い、いる~~~~~!!!!
2022-10-15_06h10_31.png

ツールボックスにいるので、もちろんD&Dで配置できます。
2022-10-15_06h13_20.png

TextBoxを継承していますから、当然TextBoxの機能は全て使えます。
あとはお好みでメソッドとか追加していけばスーパーでウルトラでハイパークールなTextBoxの出来上がりです。

実装例

こんなTextBoxを作ってみます。

  • XAML上でText属性とは別でデフォルト値を設定可能
  • 自身が持つpublicなメソッドにより、デフォルト値で表示内容(this.Text)を上書きできる

TextBoxには存在しない、DefaultTextプロパティを追加します。
このあたりの詳細はDependencyPropertyについてググってみると色々出て来ると思いますが、記法だけわかればそれでいいという人はこのまま読み進めてしまって大丈夫です。

【XAML】

MainWindow.xaml
<Window x:Class="ExtendTextBox.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:ExtendTextBox"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Grid>
        <local:SuperUltraHyperCoooooooolTextBox DefaultText="でふぉるとてきすと💪💪💪💪" x:Name="suhc_TextBox" HorizontalAlignment="Left" Margin="69,120,0,0" TextWrapping="Wrap" Text="SuperUltraHyperCoooooooolTextBox" VerticalAlignment="Top" Width="258" Height="43"/>
        <Button x:Name="button" Content="Button" HorizontalAlignment="Left" Margin="380,116,0,0" VerticalAlignment="Top" Height="52" Width="114" Click="button_Click"/>
    </Grid>
</Window>

【C#】

MainWindow.xaml.cs
using System.Windows;
using System.Windows.Controls;

namespace ExtendTextBox {
    /// <summary>
    /// MainWindow.xaml の相互作用ロジック
    /// </summary>
    public partial class MainWindow : Window {

        public MainWindow() {
            InitializeComponent();
        }

        //ボタンクリックで、スーパーでウルトラでハイパークールなTextBoxが持つメソッドを呼び出す
        private void button_Click(object sender, RoutedEventArgs e) {
            suhc_TextBox.setText_default();
        }
    }

    public class SuperUltraHyperCoooooooolTextBox : TextBox {

        #region XAMLで使える属性を追加
        //デフォルト値用の属性を追加      
        static DependencyProperty property = DependencyProperty.Register("DefaultText", typeof(string), typeof(SuperUltraHyperCoooooooolTextBox));
        public static readonly DependencyProperty DefaultTextProperty = property;
        #endregion

        #region 追加した属性と対応する公開プロパティ
        public string DefaultText {
            get { return (string)GetValue(DefaultTextProperty); }
            set { SetValue(DefaultTextProperty, value); }
        }
        #endregion

        //表示内容をデフォルト値で上書き
        public void setText_default() {
            this.Text = this.DefaultText; 
        }
    }
}

2022-10-15_07h08_21.gif

チェックボックスやラジオボタンの状態に応じて固定値と自由入力を切り替えたい場合とか重宝しそうです。
バックアップ用の変数を持たせておけば復元機能も実装できますね。
2022-10-15_07h40_39.gif

おわり

以上です。お疲れ様でした。

2
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?