2016-08-27 3 views
0

그림을 저장할 사용자 지정 격자가 TabControl이고 헤더의 디자인이 Textblock 인 개체를 설정했습니다 (TabItem). 현재 템플릿을 사용하여 헤더의 배경색을 제어하고 있으며 동일한 템플릿을 사용하여 의 Foreground 색상을 제어하는 ​​방법을 알 수 없습니다.TabControl 템플릿을 통해 TextBlock 속성을 제어하는 ​​방법

저는 초보자 인 Visual Studio C# 사람입니다.하지만이 템플릿에 대한 이해는 하위 속성 (CSS 하위 선택기와 비슷한 종류)을 설정할 때 사용할 수 있다는 것입니다. 아니면 완전히 벗어 났습니까?

여기 내 "디자인"- 당신은 사용자 정의 스타일로 상단에있는 세 개의 탭을 알 수 있습니다 다음 TabItem

<Setter Property="Template"> 

    <Setter.Value> 
     <ControlTemplate TargetType="{x:Type TabItem}"> 
      <Grid x:Name="Root"> 
       <Border x:Name="Border" Margin="0,0,-4,0"> 
        <ContentPresenter x:Name="ContentSite" 
        VerticalAlignment="Center" 
        HorizontalAlignment="Center" 
        ContentSource="Header" 
        Margin="12,2,12,2" 
        RecognizesAccessKey="True" /> 

       </Border> 

      </Grid> 
      <ControlTemplate.Triggers> 
       <!-- Selected color --> 
       <Trigger Property="IsSelected" Value="True"> 
        <!-- <Setter Property="TextElement.Foreground" TargetName="ContentSite" Value="White"/>--> 
        <Setter Property="Panel.ZIndex" Value="100" /> 
        <Setter TargetName="Border" Property="Background" Value="#FFEF690D" /> 
       </Trigger> 

       <!-- Not Selected color --> 
       <Trigger Property="IsSelected" Value="False"> 
        <Setter TargetName="Border" Property="Background" Value="#FFEE8740" /> 
       </Trigger> 

       <!-- Tab mouseovers--> 
       <MultiTrigger> 
        <MultiTrigger.Conditions> 
         <Condition Property="IsMouseOver" Value="True"/> 
         <Condition Property="IsSelected" Value="False"/> 
        </MultiTrigger.Conditions> 
        <Setter TargetName="Border" Property="Background" Value="#FFEFA470" /> 
       </MultiTrigger> 

      </ControlTemplate.Triggers> 
     </ControlTemplate> 
    </Setter.Value> 
</Setter> 

내 전류 Design with three tabs on top

내 현재 템플릿 TabControl에 대한 xaml 설정 (간략하게 세 번째 TabItem은 덜 사용함)

<TabControl x:Name="tabControl" HorizontalAlignment="Left" Height="311" Margin="0" VerticalAlignment="Top" Width="717" Background="#FFF9F9F9" Style="{DynamicResource MainMenuTabs}"> 
    <TabItem Background="{x:Null}" BorderBrush="{x:Null}" Foreground="{x:Null}"> 
     <!-- TAB 1 --> 
     <TabItem.Header> 
       <Grid x:Name="Main" Margin="0" Height="52" Width="166"> 
        <Grid.ColumnDefinitions> 
          <ColumnDefinition Width="52"/> 
          <ColumnDefinition/> 
        </Grid.ColumnDefinitions> 
        <TextBlock x:Name="textBlock" Margin="0,5,0,3" TextWrapping="Wrap" Foreground="White" FontSize="36" Grid.Column="1" d:LayoutOverrides="Width" VerticalAlignment="Bottom"><Run Text="Main"/></TextBlock> 
        <Image x:Name="icons_server_32_png" Margin="10,0,10,10" Source="icons/server-32.png" Stretch="Fill" Height="32" VerticalAlignment="Bottom"/> 
       </Grid> 
     </TabItem.Header> 
     <Grid Background="#FFE5E5E5"/> 
    </TabItem> 
    <TabItem> 
     <!-- TAB 2 --> 
     <TabItem.Header> 
       <Grid x:Name="Backups" Margin="0" Height="52" Width="216"> 
        <Grid.ColumnDefinitions> 
          <ColumnDefinition Width="52"/> 
          <ColumnDefinition/> 
        </Grid.ColumnDefinitions> 
        <TextBlock x:Name="textBlock1" Margin="0,5,0,3" TextWrapping="Wrap" Foreground="White" FontSize="36" Grid.Column="1" d:LayoutOverrides="Width" VerticalAlignment="Bottom" Text="Backups"/> 
        <Image x:Name="icons_server_32_png1" Margin="10,0,10,10" Source="icons/magnifier-tool.png" Stretch="Fill" Height="32" VerticalAlignment="Bottom"/> 
       </Grid> 
     </TabItem.Header> 
     <Grid Background="#FFE5E5E5"/> 
    </TabItem> 
</TabControl> 

답변

0

같은 종류의 작업을 수행하려는 모든 사람에게 참조하는 방법이 있습니다. e 부모 자원을 찾고 정보를 "쿼리"하십시오.

글꼴의 색을 변경하기 위해 TabItem에 트리거를 넣는 대신 TabItem의 상태를 참조한 TextBlock에 트리거를 넣었습니다.

결국 DataTrigger을 사용하고 RelativeSource 설정을 사용하여 바인딩합니다. 직접 게시물을 액세스하려고하면 제안 된 웹 사이트는 사용자를 리디렉션 일부 이유로

<Style x:Key="HeaderTextStyle" TargetType="{x:Type TextBlock}"> 
    <Setter Property="TextWrapping" Value="NoWrap"/> 
    <Setter Property="TextTrimming" Value="None"/> 
    <Setter Property="Foreground" Value="{StaticResource HeaderTextColor_NotSelected}" /> 
    <Style.Triggers> 
     <DataTrigger Binding="{Binding IsSelected, RelativeSource={RelativeSource AncestorType={x:Type TabItem}}}" Value="true"> 
      <Setter Property="Foreground" Value="{StaticResource HeaderTextColor}"/> 
     </DataTrigger> 
    </Style.Triggers> 
</Style> 
0

내가 LinqToVisualTree 사용하는 것이 좋습니다 것입니다 ...

http://blog.scottlogic.com/2010/03/04/linq-to-visual-tree.html

다음과 같이이있는 TabControl 내의 모든 "TextBlock의"컨트롤을 찾을 수 있습니다

tabControl.Descendants<TextBlock>().Where(d => d.Name=="textBlock"); 

는 그런 다음에 제어를해야합니다 TextBlock 속성

+0

: 내 경우에는 내가 {RelativeSource AncestorType={x:Type TabItem}}}

으로 TabItem에 바인딩 여기 내 TextBlock 컨트롤에 적용되는 XAML 스타일이다 - 현명한 사람에게 말하면 메인 페이지에서 "LINQ TO VISUAL TREE"를 검색하여 기사가 보일 때까지 기사를 봅니다. – duckboy81

+0

아아, 고마워. 제안 된 솔루션이 도움이되기를 바랍니다. – MohamedHamza

관련 문제