GoogleChrome 브라우저 검색과 같은 WPF 검색 상자 스타일을 얻으려면 어떻게해야합니까?

Question

Google 크롬 브라우저 에서처럼 WPF에서 검색 기능을 사용할 계획입니다. 샘플은 내가 백엔드 코드를 준비

아래에 표시되어 있지만, 나는 아래와 같은 텍스트 상자 갖고 싶어 - 나는 또한 결과를 표시 할 수있는 (같은 0 0).
또한 다음 및 이전에 화살표를 사용하고 싶습니다.
XAML의 WPF에서 이러한 TextBox를 어떻게 디자인합니까? 제발 나를 안내 해줘.

Answer 1

사용자 정의 컨트롤은 다음 코드를 사용하여 만들 수 있습니다 :

public class SearchTextBox : Control 
{ 
    public String Text 
    { 
     get { return (String)GetValue(TextProperty); } 
     set { SetValue(TextProperty, value); } 
    } 

    // Using a DependencyProperty as the backing store for Text. This enables animation, styling, binding, etc... 
    public static readonly DependencyProperty TextProperty = 
     DependencyProperty.Register("Text", typeof(String), typeof(SearchTextBox), new UIPropertyMetadata(null)); 

    public String SearchStatusText 
    { 
     get { return (String)GetValue(SearchStatusTextProperty); } 
     set { SetValue(SearchStatusTextProperty, value); } 
    } 

    // Using a DependencyProperty as the backing store for SearchStatusText. This enables animation, styling, binding, etc... 
    public static readonly DependencyProperty SearchStatusTextProperty = 
     DependencyProperty.Register("SearchStatusText", typeof(String), typeof(SearchTextBox), new UIPropertyMetadata(null)); 

    static SearchTextBox() 
    { 
     DefaultStyleKeyProperty.OverrideMetadata(typeof(SearchTextBox), new FrameworkPropertyMetadata(typeof(SearchTextBox))); 
    } 
} 

스타일을

<Style TargetType="{x:Type local:SearchTextBox}"> 
    <Setter Property="Template"> 
     <Setter.Value> 
      <ControlTemplate TargetType="{x:Type local:SearchTextBox}"> 
       <Border Background="{TemplateBinding Background}" 
         BorderBrush="{TemplateBinding BorderBrush}" 
         BorderThickness="{TemplateBinding BorderThickness}"> 
        <Grid> 
         <Grid.ColumnDefinitions> 
          <ColumnDefinition /> 
          <ColumnDefinition Width="Auto" /> 
          <ColumnDefinition Width="Auto" /> 
          <ColumnDefinition Width="Auto" /> 
         </Grid.ColumnDefinitions> 
         <TextBox Grid.Column="0" 
           Text="{TemplateBinding Text}" /> 
         <TextBlock Grid.Column="1" 
            Text="{TemplateBinding SearchStatusText}"></TextBlock> 
         <Button Grid.Column="2"> 
          <Polyline Points="0,10 5,0 10,10" 
             Stroke="Black" 
             StrokeThickness="2" /> 
         </Button> 
         <Button Grid.Column="3"> 
          <Polyline Points="0,0 5,10 10,0" 
             Stroke="Black" 
             StrokeThickness="2" /> 
         </Button> 
        </Grid> 
       </Border> 
      </ControlTemplate> 
     </Setter.Value> 
    </Setter> 
</Style> 

generic.xaml을

에 당신은 당신의 필요에 따라 변경해야합니다. 그러나 이것은 좋은 출발점이되어야합니다.

Answer 2

요구 사항에 맞는 준비가 된 솔루션이 없습니다. 기존 컨트롤의 컨트롤 템플릿으로 꽤 많은 것을 만들거나 처음부터 사용자 지정 컨트롤을 만들 수 있습니다.

http://msdn.microsoft.com/en-us/library/aa970773%28VS.85%29.aspx