「東雲 忠太郎」の平凡な日常のできごと

「東雲 忠太郎」の平凡な日常のできごと

2024.03.25
XML
カテゴリ: C#.NET


TextBox をカスタマイズするには、WPF のスタイルとテンプレートを使用して外観を変更します。以下は、TextBox をカスタマイズするサンプルコードです。


```xml

<Window x:Class="CustomizeTextBox.MainWindow"

        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"

        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"

        Title="Customize TextBox" Height="250" Width="350">

    <Window.Resources>

        <!-- TextBox の新しいスタイルを定義 -->

        <Style x:Key="CustomTextBoxStyle" TargetType="TextBox">

            <Setter Property="Foreground" Value="Black"/>

            <Setter Property="Background" Value="LightGray"/>

            <Setter Property="BorderBrush" Value="DarkGray"/>

            <Setter Property="BorderThickness" Value="1"/>

            <Setter Property="Padding" Value="5"/>

            <Setter Property="FontSize" Value="14"/>

            <Setter Property="MinHeight" Value="30"/>

            <Setter Property="MinWidth" Value="120"/>

            <!-- テンプレートを変更 -->

            <Setter Property="Template">

                <Setter.Value>

                    <ControlTemplate TargetType="TextBox">

                        <Border Background="{TemplateBinding Background}"

                                BorderBrush="{TemplateBinding BorderBrush}"

                                BorderThickness="{TemplateBinding BorderThickness}">

                            <ScrollViewer Margin="0" x:Name="PART_ContentHost"/>

                        </Border>

                        <ControlTemplate.Triggers>

                            <!-- マウスオーバー時のスタイル -->

                            <Trigger Property="IsMouseOver" Value="True">

                                <Setter Property="Background" Value="LightBlue"/>

                            </Trigger>

                            <!-- フォーカス時のスタイル -->

                            <Trigger Property="IsKeyboardFocusWithin" Value="True">

                                <Setter Property="BorderBrush" Value="Blue"/>

                                <Setter Property="BorderThickness" Value="2"/>

                            </Trigger>

                        </ControlTemplate.Triggers>

                    </ControlTemplate>

                </Setter.Value>

            </Setter>

        </Style>

    </Window.Resources>

    <Grid>

        <!-- スタイルを適用した TextBox -->

        <TextBox Style="{StaticResource CustomTextBoxStyle}" Text="Customized TextBox"/>

    </Grid>

</Window>

```


この例では、`Window.Resources` 内で新しいスタイルを定義し、それを `TextBox` に適用しています。新しいスタイルでは、`Foreground`、`Background`、`BorderBrush`、`BorderThickness`、`Padding`、`FontSize`、`MinHeight`、`MinWidth` などのプロパティを設定しています。また、`Template` プロパティを使用してテンプレートを変更し、`ScrollViewer` を追加してテキストのスクロールをサポートしています。`ControlTemplate.Triggers` を使用して、マウスオーバー時やフォーカス時などの状態に応じてスタイルを変更するトリガーを定義しています。


これにより、カスタムの外観を持つ TextBox を作成することができます。






お気に入りの記事を「いいね!」で応援しよう

Last updated  2024.03.25 06:13:30


【毎日開催】
15記事にいいね!で1ポイント
10秒滞在
いいね! -- / --
おめでとうございます!
ミッションを達成しました。
※「ポイントを獲得する」ボタンを押すと広告が表示されます。
x

© Rakuten Group, Inc.
Create a Mobile Website
スマートフォン版を閲覧 | PC版を閲覧
Share by: