WPF 사용자 정의 컨트롤 사용 (예 : 워터 마크 및 글꼴 아이콘과 텍스트 상자 등)

를 참조하십시오

 

 

 만든 사람 :

  1. 사용자 정의 컨트롤 만들기 (UserControl을)
  2. 사용 제어 코드에 대한 수정 사용자가 프론트 데스크 UserControl을 대신 텍스트 상자의 모서리를 왼쪽, 배경은 UserControl을 목적의 코드로 대체 될 것이다 현재의 모습이 있음을 TextBox 컨트롤 및 참고 상속 TextBox 컨트롤을하도록하는 것입니다
    코드 렌더링을 전경 :

     

     


     

     배경 렌더링 코드 :

     

  3. 종속성 속성 만들기 :

     두 번 클릭하여 입력 바로 가기 키 Tab 키 생성 된 코드 propdp

    공공 INT의  MyProperty 
            { 
                GET {리턴 (INT) GetValue ( MyPropertyProperty ); } 
                집합 {SetValue는 ( MyPropertyProperty , 값); } 
            } 
            공공 정적 판독 전용 DependencyProperty에 MyPropertyProperty = 
                DependencyProperty.Register ( " MyProperty 대해서 typeof"의 typeof (INT) ( ownerclass ) 새로운 PropertyMetadata ( 0 ));
    
    팁 : INT는 당신의 컨트롤 속성의 유형입니다, MyProperty 제어 속성 이름, MypropertyProperty 사용자 정의 이름 ownerclass, 새로운 PropertyMetadata (0) 0은 기본값 (필수), 마음에 같은 색상의 텍스트이며, 속성 이름에 의존이다 모든 대응은 동일해야합니다
    예를 들어, 나는 글꼴 아이콘, 다음 코드를 추가합니다 :
    공공 문자열 특별하다고 
            { 
                GET {반환 (문자열) GetValue (IcoProperty); } 
                집합 {SetValue는 (IcoProperty, 값); } 
            } 
            공공 정적 판독 전용 DependencyProperty에 IcoProperty = 
                DependencyProperty.Register (대해서 typeof (문자열 "이코")의 typeof (LayuiTextBox) 새로운 PropertyMetadata ( "\ xf007"));
    

 

 반환 코드가 수신 제어 스타일을 변경합니다 (D : DesignHeight = "50"D : DesignWidth = "200"- >>> 아날로그 인터페이스는 현재 디자인의 폭과 높이를 의미) 편집을 마우스 오른쪽 버튼으로 클릭 인터페이스는 사본을 편집 템플릿은 현재 마우스로 선택 그림과 같이이 시간에 우리 VS 도구는 자동으로 현재 인터페이스의 내용을 변경하는 데 사용되는 모든 컨트롤을 표시합니다 :

 

  5. 수정 된 ControlTemplate은 스타일, 우리는 그리드에 테두리와 그리드에 직접 두를 추가, 콘텐츠 저장 폰트 아이콘이 다른 같은 이름 ICO TextBlock의 제어 위의 이미지로 입력 상자를 들고가 유지 글꼴 아이콘, 하는 nanE 프롬프트과 PART_ContentHost는 워터 마크 글꼴 입력 각각이다

  

<테두리 X : 이름 = "국경"CornerRadius를 = "{ElementName을 = LayTextBox, 경로 = BorderRadius 바인딩}"BorderBrush = "{TemplateBinding BorderBrush}"의 경계선 = "{TemplateBinding의 경계선}"배경 = "{TemplateBinding 배경}"SnapsToDevicePixels = " 진정한 "> 
                            <그리드> 
                                <Grid.ColumnDefinitions> 
                                    <ColumnDefinition 이름 ="icoWidth "너비 ="50 "/> 
                                    <ColumnDefinition /> 
                                </Grid.ColumnDefinitions> 
                                <TextBlock의 이름 ="ICO " 텍스트 ="{바인딩 ElementName을 = LayTextBox ,경로 = 특별하다고} " HorizontalAlignment로 ="센터 "VerticalAlignment ="센터 "> </ TextBlock에>
                                <TextBlock의 이름 = "프롬프트"Grid.Column을 = "1"불투명도 = "0"여백 = "0,0,5,0"텍스트 = "{바인딩 ElementName을 = LayTextBox, 경로 = 프롬프트}"HorizontalAlignment로 = "왼쪽"VerticalAlignment = "센터"> </ TextBlock이> 
                                <ScrollViewer에 Grid.Column을 = "1"X : NAME = "PART_ContentHost"초점 설정 = "FALSE"HorizontalScrollBarVisibility = "= Grid.ColumnSpan ="2 "여유"숨겨진 "VerticalScrollBarVisibility ="숨겨진 " 0,0,5,0 "/> 
                            </ 그리드> 
                        </ 국경>

  참고 : 배경 특별하다고 속성에 우리와 함께 등록 된 바인딩 텍스트 텍스트에 빨간색 배경의 내용은 특별하다고는 전류 제어 LayTextBox의 이름으로 재산을 찾고 대해 이야기 ElementName을 = LayTextBox, 경로 = 특별하다고 특별하다고 바인딩,이 값을 전달하는 데 사용됩니다 ElementName을 현재 제어 이름, 경로 속성의 이름입니다

  6. 트리거

<ControlTemplate.Triggers> 
                            <DataTrigger 바인딩 = "{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"값 = "거짓"> 
                                <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

  8. 우리는 자기 정의 컨트롤 <layui 사용 LayuiTextBox 이코 = " & # xf2b9, "X : 이름 = "텍스트"프롬프트 = "입력 한 사용자 이름"BorderRadius = "10"은 FontFamily = "/ LayUI - WPF, 구성 요소 /를 글꼴 / # FontAwesome "/>이 특별하다고 특별하다고 우리는 우리가 우리가 원하는 효과에 글꼴 아이콘 코드를 저장할 수있는 대지 경계선을 정의되는 경우가

  9. 등등 워터 마크, 그리고 달성 할 수 입력 상자 빈 단추 심지어 테두리, 다음은 내 워터 마크 및 글꼴 아이콘 입력 상자 코드로 작성된 것입니다

  리셉션 코드 :

<TextBox.Resources> 
        <스타일 X : 키 = "TextBoxStyle"은 TargetType = "{X : 입력 텍스트 상자}"> 
            <setter 속성 = "BorderBrush"값 = "# ddd를"/> 
            = "폭"값 <setter 속성 = " 200 "/> 
            <setter 속성 ="높이 "값 ="50 "/> 
            <setter 속성 ="전경 "값 ="블랙 "/> 
            <setter 속성 ="VerticalContentAlignment "값 ="센터 "/> 
            <setter 속성 = "경계선의"값 = "1"/> 
            <setter 속성 = "AllowDrop의"값 = "진정한"/> 
            <setter 속성 = "ScrollViewer.PanningMode "값 ="VerticalFirst은 "/> 
            <세터 속성 =" "값 ="거짓 "/> Stylus.IsFlicksEnabled  
            <setter 속성 ="템플릿 ">
                <Setter.Value> 
                    <된 ControlTemplate은 TargetType = "{X : 입력 텍스트 상자}"> 
                        <테두리 X : 이름 = "국경"CornerRadius를 = "{경우 ElementName = LayTextBox 바인딩, 경로 = BorderRadius}"BorderBrush = "{TemplateBinding BorderBrush}"의 경계선 = "{TemplateBinding의 경계선}"배경 = "{TemplateBinding 배경}"SnapsToDevicePixels = "진정한"> 
                            <그리드> 
                                <Grid.ColumnDefinitions> 
                                    <ColumnDefinition 이름 = "icoWidth"너비 = "50"/> 
                                    <ColumnDefinition />
                                </Grid.ColumnDefinitions> 
                                <TextBlock의 이름 ="ICO "텍스트 = "{바인딩 ElementName을 = LayTextBox, 경로 = 특별하다고} "HorizontalAlignment로 ="센터 "VerticalAlignment ="센터 "> </ TextBlock에>
                                <TextBlock의 이름 = "프롬프트"Grid.Column을 = "1"불투명도 = "0"여백 = "0,0,5,0"텍스트 = "{바인딩 ElementName을 = LayTextBox, 경로 = 프롬프트}"HorizontalAlignment로 = "왼쪽"VerticalAlignment = "센터"> </ TextBlock이> 
                                <ScrollViewer에 Grid.Column을 = "1"X : NAME = "PART_ContentHost"초점 설정 = "FALSE"HorizontalScrollBarVisibility = "= Grid.ColumnSpan ="2 "여유"숨겨진 "VerticalScrollBarVisibility ="숨겨진 " 0,0,5,0 "/> 
                            </ 그리드> 
                        </ 국경>값 = "거짓"> 
                                <세터에서 targetName = "icoWidth"속성 = "폭"값 = "0"/> 
                        <ControlTemplate.Triggers>
                            <DataTrigger는 = "{RelativeSource 바인딩 = {RelativeSource 자체}, 경로 = IcoStatus}"값 = "false"를 바인딩>트리거 속성 = "의 IsEnabled"값 = "거짓"> 
                                <setter 속성 = "불투명도"targetName을 = "경계"값 = "0.56"/>
                                <세터에서 targetName = "PART_ContentHost"속성 = "여백"값 = "5,0,5,0"/> 
                                <세터에서 targetName = "프롬프트"속성 = "여백"값 = "5,0,5,0"/> 
                            </ DataTrigger> 
                            <트리거 속성 = "텍스트"값 = ""> 
                                <setter 속성 = "불투명도"값 = ". 3"에서 targetName = "프롬프트"/> 
                            </ 트리거> 
                            <트리거 속성 = "의 IsEnabled"값 = " 거짓 "> 
                            </ 트리거> 
                            <트리거 속성 = "IsMouseOver"값 = "진정한"> 
                                <setter 속성 = "BorderBrush"targetName을 = "경계"값 = "# D2D2D2"/>
                            </ 트리거> 
                            <트리거 속성 = 값 = "true"를 "IsKeyboardFocused"> 
                                <setter 속성 = "BorderBrush"targetName을 = "경계"값 = "# D2D2D2"/> 
                            </ 트리거> 
                        </ControlTemplate.Triggers> 
                    </ ControlTemplate이 > 
                </Setter.Value> 
            </ 세터> 
            <Style.Triggers> 
            </Style.Triggers> 
        </ 스타일> 
    </TextBox.Resources>

  배경 코드 :

/// <요약> 
    /// LayuiTextBox.xaml的交互逻辑
    /// </ 요약> 
    공용 부분 클래스 LayuiTextBox : 텍스트 상자 
    { 
        공개 LayuiTextBox () 
        { 
            InitializeComponent를 (); 
        } 
        공공 문자열 특별하다고 
        { 
            GET {반환 (문자열) GetValue (IcoProperty); } 
            집합 {SetValue는 (IcoProperty, 값); } 
        } 
        공공 정적 판독 전용 DependencyProperty에 IcoProperty = 
            DependencyProperty.Register (대해서 typeof (문자열 "이코")의 typeof (LayuiTextBox) 새로운 PropertyMetadata ( "\ xf007")); 
        공공 부울 IcoStatus 
        {
            얻을 {반환 (BOOL) GetValue (IcoStatusProperty); } 
            집합 {SetValue는 (IcoStatusProperty, 값); } 
        } 
        공공 정적 판독 전용 DependencyProperty에 IcoStatusProperty = 
            DependencyProperty.Register (대해서 typeof (BOOL "IcoStatus")의 typeof (LayuiTextBox) 새로운 PropertyMetadata (TRUE)); 
        공공 문자열 프롬프트 
        { 
            GET {반환 (문자열) GetValue (PromptProperty); } 
            집합 {SetValue는 (PromptProperty, 값); } 
        } 
        공공 정적 판독 전용 DependencyProperty에 PromptProperty = 
            DependencyProperty.Register (새 PropertyMetadata 등) 대해서 typeof (LayuiTextBox,의 typeof (문자열) '확인'( "这是水印")); 
        BorderRadius 공공 INT를 
        { 
            GET {리턴 (INT) GetValue (BorderRadiusProperty); } 
            세트 {SetValue는 (BorderRadiusProperty, 값); } 
        } 
        
        공공 정적 판독 전용 DependencyProperty에 BorderRadiusProperty = 
            DependencyProperty.Register (대해서 typeof (INT "BorderRadius")의 typeof (LayuiTextBox) 새로운 PropertyMetadata (2)); 
        
    }

  마지막 사진 스타일을 볼 수있는 스타일을 보여줍니다

특별 참고 : 아이콘 글꼴  글꼴 최고

저자 : 수줍음 개구리

시간 : 2020년 3월 28일 18시 39분

추천

출처www.cnblogs.com/ShyFrog/p/12588718.html