（そのような透かしやフォント、アイコンとテキストボックスなど）WPFカスタムコントロールと使用

それを参照してください。

 

 

 初出：

1. ユーザーコントロールを作成します（ユーザーコントロール）
2. 使用制御コードへの変更のユーザーは、フロントデスクのユーザーコントロールの代わりにテキストボックスの角を左に、背景がユーザーコントロールの目的のためのコードに置き換えられますが、現在の数字があることTextBoxコントロールとノート継承TextBoxコントロールをさせることです
   コードのレンダリングをフォアグラウンド：

   

    

    

   
   

    

    背景レンダリングコード：

   

    

3. 依存関係プロパティを作成します。
   
   

    入力ショートカットキーTabキー生成されたコードのpropdpをダブルクリックします

   公共int型の MYPROPERTY 
           { 
               取得{リターン（int型）のGetValue（MyPropertyProperty）。} 
               のセット{値の代入（MyPropertyProperty、値）。} 
           } 
           パブリック静的読み取り専用たDependencyProperty MyPropertyProperty = 
               DependencyProperty.Register（ " MYPROPERTY "、typeof演算（INT）、typeof演算（ownerclass）、新しいPropertyMetadata（0））。
   

   ヒント：intは、あなたのコントロールのプロパティのタイプで、MYPROPERTYがコントロールのプロパティ名で、MypropertyPropertyは、属性名に依存している、ownerclassカスタム名、新しいPropertyMetadata（0）0は、心の中で同じ色のテキスト、デフォルト値（必須）でありますすべての対応が同じでなければなりません
   例を、私は、フォントのアイコン、次のコードを追加します：
   

   公共の文字列イコー
           { 
               GET {リターン（文字列）のGetValue（IcoPr​​operty）。} 
               のセット{値の代入（IcoPr​​operty、値）。} 
           } 
           パブリック静的読み取り専用たDependencyProperty IcoPr​​operty = 
               DependencyProperty.Register（typeof演算"イコー"（文字列）、typeof演算（LayuiTextBox）、新しいPropertyMetadata（ "\ xf007"））;
   

 

 、右クリック編集へのインタフェース現在、マウスで選択したコピーテンプレート編集 - リターンコードは、その受信制御スタイル（>>>アナログインターフェース、現在のデザインの幅と高さを指しDesignWidth =「200」：：DesignHeight =「50」D d）を変更します示すように、この時点で私たちVSツールは自動的に、現在のインタフェースのコンテンツを変更するために使用されるすべてのコントロールが表示されます。

 

　　5.変更のControlTemplateスタイルで、我々はグリッド内境界線、およびグリッドに直接両者を追加、コンテンツ格納されたフォントアイコンは、他のそのような名前ICOのTextBlockコントロール上記画像として入力ボックスを、保持が維持されているフォントのアイコン、 Naneは、プロンプトで、PART_ContentHostは透かしフォントタイピングそれぞれ

　　

<境界は、x：NAME = "境界" CornerRadius = "{バインディングのElementName = LayTextBox、PATH = BorderRadius}" BorderBrush = "{TemplateBindingのBorderBrush}" BorderThickness = "{TemplateBindingのBorderThickness}"背景= "{TemplateBindingの背景}" SnapsToDevicePixels =」を真"> 
                            <グリッド> 
                                <Grid.ColumnDefinitions> 
                                    <ColumnDefinition NAME =" icoWidth "幅= "50"/> 
                                    <ColumnDefinition /> 
                                </Grid.ColumnDefinitions> 
                                <テキストブロック名= "ICO" テキスト=" {バインディングのElementName = LayTextBox 、パス=イコー}」パス=イコー}」 たHorizo​​ntalAlignment = "センター" VerticalAlignmentを= "センター"> </ TextBlockの>
                                <テキストブロック名= "プロンプト" Grid.Column = "1"不透明度= "0"マージン= "0,0,5,0"テキスト= "{バインディングのElementName = LayTextBox、PATH =プロンプト}"たHorizo​​ntalAlignment = "左" VerticalAlignmentを= "センター"> </ TextBlockの> 
                                <ScrollViewerのGrid.Column = "1" X：名= "PART_ContentHost" Focusableの= "false"をHorizo​​ntalScrollBarVisibility =「= Grid.ColumnSpan = "2"余白"隠された" VerticalScrollBarVisibility = "隠されました" 0,0,5,0" /> 
                            </グリッド> 
                        </ボーダー>

　　注：背景のICOプロパティで私たちに登録されている結合テキストテキストの赤い背景の内容は、ICOが、電流制御LayTextBoxの名前でプロパティを探して話しているのElementName = LayTextBox、パス=イコーイコーバインディング、この値を渡すために使用されますelementNameが現在のコントロール名で、パスは属性名です

　　6.トリガーを設定します。

<ControlTemplate.Triggers> 
                            <Da​​taTriggerバインド= "{バインディングRelativeSource = {RelativeSource自己}、パス= IcoStatus}"値= "偽"> 
                                <セッターTargetNameは= "icoWidth"プロパティ= "幅"値= "0" /> 
                                <セッターTargetNameは= "PART_ContentHost"プロパティ= "マージン"値= "5,0,5,0" /> 
                                <セッターTargetNameは= "プロンプト"プロパティ= "マージン"値= "5,0,5,0" /> 
                            < / DataTrigger> 
                            <トリガプロパティ= "テキスト"値= ""> 
                                <setterプロパティ= "不透明度"値=」3" TargetNameは= "プロンプト" /> setterプロパティ= "不透明度"値=」3" TargetNameは= "プロンプト" /> 
                            </トリガー>
                            <トリガプロパティ= "でIsEnabled"値= "false"に>
                                <setterプロパティ= "不透明度" TargetNameは= "国境"値= "0.56" /> 
                            </トリガ> 
                            <トリガープロパティ= "IsMouseOver"値= "真の"> 
                                <setterプロパティ= "BorderBrush" TargetNameは= "国境"値= "＃D2D2D2" /> 
                            </トリガ> 
                            <トリガープロパティ= "IsKeyboardFocused"値= "真の"> 
                                <setterプロパティ= "BorderBrush" TargetNameは= "国境"値= "＃D2D2D2" /> 
                            </トリガー> 
 </ControlTemplate.Triggers>

　　注：ユーザーが話しているときに、ユーザがこのようなバインディング=「{バインディングRelativeSource = {RelativeSource自己}、パス= IcoStatus}」値=「false」のように、時間に対応する値を入力した場合、イベントデータはDataTriggerトリガー開始手段トリガ入力は、トリガは、イベントトリガが対応する制御ファイル属性プロパティトリガ特定の条件ヌル効果であります

　　：現在のカスタム現在のメインインタフェースのxmlnsに引用されたコントロール（LayuiTextBox）、呼び出すためのメインインターフェイスに7.戻りlayui =「CLR名前空間：LayUI_WPF.CustomControl」、この引用は、現在のフォームを言っているがCustomControlでLayUI_WPFフォルダ現在のプロジェクトを呼び出し、次のカスタムコントロールと名付けlayui

　　LayuiTextBox：8.私たちは、自己定義されたコントロール<layui使用イコー = " ;＆＃xf2b9 X"：名= "テキスト"プロンプト= "ユーザー名を入力し、" BorderRadius = "10"のfontFamily = 「/ LayUI-WPFを、コンポーネント/ フォント/＃FontAwesome「/>、それがico icoが、私たちは私たちがしたいことを効果にフォントアイコンコードを格納することができ敷地境界線を定義している場合があります

　　9.というように、透かし、および達成することができ、入力ボックス空のボタンでさえも境界線が、以下は私の透かしやフォント、アイコン入力ボックスのコードで書かれています

　　レセプションコード：

<TextBox.Resources> 
        <スタイル×：キー= "TextBoxStyle" TargetTypeに= "{X：タイプテキストボックス}"> 
            <setterプロパティ= "BorderBrush"値= / "＃がddd"> 
            「= <setterプロパティ= "幅"値を200 "/> 
            <setterプロパティ="高さ」の値= "50" /> 
            <setterプロパティ= "フォアグラウンド"値= "黒" /> 
            <setterプロパティ= "VerticalContentAlignment"値= "センター" /> 
            <setterプロパティ= "BorderThickness"値= "1" /> 
            <setterプロパティ= "AllowDrop"値= "true"を/> 
            <setterプロパティ=」ScrollViewer.PanningMode」値= "VerticalFirst" /> 
            <setterプロパティ= "Stylus.IsFlicksEnabled"値= "偽" /> 
            <setterプロパティ= "テンプレート">
                <Setter.Value> 
                    <たControlTemplate TargetTypeに= "{X：タイプテキストボックス}"> 
                        <ボーダー×：NAME = "境界" CornerRadius = "{バインディングのElementName = LayTextBox、PATH = BorderRadius}" BorderBrush = "{TemplateBindingのBorderBrush}" BorderThickness = "{TemplateBindingのBorderThickness}"背景= "{TemplateBindingの背景}" SnapsToDevicePixels = "TRUE"> 
                            <グリッド> 
                                <Grid.ColumnDefinitions> 
                                    <ColumnDefinition NAME = "icoWidth"幅= "50" /> 
                                    <ColumnDefinition />
                                </Grid.ColumnDefinitions>
                                </のTextBlock> <= "{バインディングのElementName = LayTextBox、PATH =イコー}"たHorizo​​ntalAlignment = "センター" VerticalAlignmentを= "センター"テキストブロック名= "ICO"テキスト> 
                        <ControlTemplate.Triggers>
                                <テキストブロック名= "プロンプト" Grid.Column = "1"不透明度= "0"マージン= "0,0,5,0"テキスト= "{バインディングのElementName = LayTextBox、PATH =プロンプト}"たHorizo​​ntalAlignment = "左" VerticalAlignmentを= "センター"> </ TextBlockの> 
                                <ScrollViewerのGrid.Column = "1" X：名= "PART_ContentHost" Focusableの= "false"をHorizo​​ntalScrollBarVisibility =「= Grid.ColumnSpan = "2"余白"隠された" VerticalScrollBarVisibility = "隠されました" 0,0,5,0 "/> 
                            </グリッド> 
                        </ボーダー> 
                            <Da​​taTriggerバインド=" {バインディングRelativeSource = {RelativeSource自己}、パス= IcoStatus}」値= "偽"> 
                                <セッターTargetNameは= "icoWidth"プロパティ= "幅"値= "0" />
                                <セッターTargetNameは= "PART_ContentHost"プロパティ= "マージン"値= "5,0,5,0" /> 
                                <セッターTargetNameは= "プロンプト"プロパティ= "マージン"値= "5,0,5,0" /> 
                            </ DataTrigger> 
                            <トリガプロパティ= "テキスト"値= ""> 
                                <setterプロパティ= "不透明度"値= "3" TargetNameは= "プロンプト"/> 
                            </トリガ> 
                            <トリガープロパティ= "でIsEnabled"値="偽"> トリガプロパティ= "でIsEnabled"値= "偽"> 
                                <setterプロパティ= "不透明度" TargetNameは= "国境"値= "0.56" />
                            </トリガー> 
                            <トリガプロパティ= "IsMouseOver"値= "真の"> 
                                <setterプロパティ= "BorderBrush" TargetNameは= "国境"値= "＃D2D2D2" /> 
                            </トリガ> 
                            <トリガープロパティ= "IsKeyboardFocused"値= "真の"> 
                                <setterプロパティ= "BorderBrush" TargetNameは= "国境"値= "＃D2D2D2" /> 
                            </トリガー> 
                        </ControlTemplate.Triggers > 
                    </ ControlTemplateの> 
                </Setter.Value> 
            </セッター> 
            <Style.Triggers> 
            </Style.Triggers> 
        </スタイル> 
    </TextBox.Resources>

　　背景コード：

/// <要約> 
    /// LayuiTextBox.xaml的交互逻辑
    /// </要約> 
    公共部分クラスLayuiTextBox：テキストボックス
    { 
        パブリックLayuiTextBox（）
        { 
            のInitializeComponent（）; 
        } 
        パブリック文字列イコー
        { 
            GET {リターン（列）のGetValue（IcoPr​​operty）。} 
            のセット{値の代入（IcoPr​​operty、値）。} 
        } 
        パブリック静的読み取り専用たDependencyProperty IcoPr​​operty = 
            DependencyProperty.Register（typeof演算"イコー"（文字列）、typeof演算（LayuiTextBox）、新しいPropertyMetadata（ "\ xf007"））; 
        パブリックブールIcoStatus 
        {
            取得{戻り（BOOL）のGetValue（IcoStatusProperty）。} 
            のセット{値の代入（IcoStatusProperty、値）。} 
        } 
        パブリック静的読み取り専用たDependencyProperty IcoStatusProperty = 
            DependencyProperty.Register（ "IcoStatus"、typeof演算（BOOL）、typeof演算（LayuiTextBox）、新しいPropertyMetadata（真））。
        公共の文字列プロンプト
        { 
            GET {リターン（文字列）のGetValue（PromptProperty）。} 
            のセット{値の代入（PromptProperty、値）。} 
        } 
        パブリック静的読み取り専用たDependencyProperty PromptProperty = 
            DependencyProperty.Register（ "プロンプト"、typeof演算（文字列）、typeof演算（LayuiTextBox）、新しいPropertyMetadata（ "这是水印"））; 
        公共INT BorderRadius 
        { 
            GET {リターン（INT）のGetValue（BorderRadiusProperty）。}
            セット{値の代入（BorderRadiusProperty、値）。} 
        } 
        
        パブリック静的読み取り専用たDependencyProperty BorderRadiusProperty = 
            DependencyProperty.Register（ "BorderRadius"、typeof演算（INT）、typeof演算（LayuiTextBox）、新しいPropertyMetadata（2））。
        
    }

　　最後の写真は、スタイルでそれを見るためにスタイルを示してい

特記事項：アイコンフォント  フォント恐ろしいです

著者：恥ずかしがり屋のカエル

時間：2020年3月28日夜06時39分