Einstellung TabItem Vordergrundfarbe setzt auch das TabControl-Vordergrundfarbe

Ich habe ein TabControl, das habe ich neu gestaltet. Das TabItem hat einen trigger, der ausgelöst wird, wenn das TabItem ausgewählt ist, ändert das TabItem text Fett und grün. Das problem ist, dass ich den text in den Inhalt der Register wird auch festgelegt, zu Fett und grün.

Kann ich umgehen dies, indem Sie alle meine Steuerelemente in der Registerkarte Inhalt werden die Farbe und die schriftart Gewicht, das ich will, aber sollte ich haben, dies zu tun? Also, ich habe, um sicherzustellen, dass jeder textblock in den Inhaltsbereich hat einen Stil, der setzt die Farbe auf schwarz und font-weight normal.

Wie kann ich den IsSelected Teil der TabItem zu zeigen grün, aber lassen Sie den Inhalt der Registerkarte alleine?

Ich habe versucht, um die Vorder-von der TabControl auf schwarz, aber das funktioniert nicht.

Sehen Sie das Codebeispiel unten, dass der text auf der ersten Registerkarte wird grün und ich will es schwarz, aber ohne jede Kontrolle in der Registerkarte Inhalt.

Code-Beispiel unten:

    <Grid>
    <Grid.Resources>
        <!-- Tab item -->
        <Style TargetType="{x:Type TabItem}">
            <Setter Property="FontSize" Value="14"/>
            <Setter Property="MinWidth" Value="200"/>
            <Setter Property="FocusVisualStyle" Value="{x:Null}"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type TabItem}">
                        <Grid>
                            <Border Name="Border" Padding="5,2">
                                <ContentPresenter ContentSource="Header"/>
                            </Border>
                        </Grid>
                        <ControlTemplate.Triggers>
                            <MultiTrigger>
                                <MultiTrigger.Conditions>
                                    <Condition Property="Border.IsMouseOver" Value="True"/>
                                    <Condition Property="IsSelected" Value="False"/>
                                </MultiTrigger.Conditions>
                                <Setter Property="FontWeight" Value="Bold"/>
                                <Setter Property="Foreground" Value="Black"/>
                            </MultiTrigger>

                            <MultiTrigger>
                                <MultiTrigger.Conditions>
                                    <Condition Property="Border.IsMouseOver" Value="False"/>
                                    <Condition Property="IsSelected" Value="False"/>
                                </MultiTrigger.Conditions>
                                <Setter Property="Foreground" Value="Black" />
                            </MultiTrigger>

                            <Trigger Property="IsSelected" Value="True">
                                <Setter Property="Foreground" Value="Green"/>
                                <Setter Property="FontWeight" Value="Bold"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

        <!-- Tab control -->
        <Style  TargetType="{x:Type TabControl}">
            <Setter Property="SelectedIndex" Value="0"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type TabControl}">
                        <Grid>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="200" />
                                <ColumnDefinition Width="*" />
                            </Grid.ColumnDefinitions>
                            <Border Grid.Column="0" Padding="5" Margin="0,0,5,0" CornerRadius="3">
                                <StackPanel Orientation="Vertical">
                                    <ScrollViewer VerticalScrollBarVisibility="Auto" FocusVisualStyle="{x:Null}">
                                        <TabPanel IsItemsHost="True"/>
                                    </ScrollViewer>
                                </StackPanel>
                            </Border>
                            <Border Grid.Column="1" BorderBrush="Black" BorderThickness="0">
                                <ScrollViewer VerticalScrollBarVisibility="Auto" FocusVisualStyle="{x:Null}" Padding="10,0">
                                    <ContentPresenter ContentSource="SelectedContent"/>
                                </ScrollViewer>
                            </Border>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

    </Grid.Resources>

    <TabControl Name="tabControl" TabStripPlacement="Left">
        <!-- First tab item -->
        <TabItem IsSelected="True">
            <TabItem.Header>
                <StackPanel Orientation="Horizontal">
                    <TextBlock Text="Profile"/>
                </StackPanel>
            </TabItem.Header>
            <TextBlock Text="Page 1 Sample Text with no foreground set." FontSize="30"/>
        </TabItem>

        <!-- Second tab item -->
        <TabItem IsSelected="True">
            <TabItem.Header>
                <StackPanel Orientation="Horizontal">
                    <TextBlock Text="Profile"/>
                </StackPanel>
            </TabItem.Header>
            <TextBlock Text="Page 2 Sample Text with foreground set manually." FontSize="30" Foreground="Red"/>
        </TabItem>
    </TabControl>
</Grid>

Post code, um herauszufinden, was falsch ist!
Hinzugefügt code-Beispiel, wie verlangt.

InformationsquelleAutor Adrian | 2010-06-21

10

Dann komme ich eben über diese sehr gleiche problem, und nach hantieren mit es ein wenig ich glaube, ich habe gefunden eine elegantere Lösung.

Sage ich eleganter, da es würde den ContentPresenter intakt, und wenden Sie die Vordergrund-und die fontweight-setter, der ContentPresenter die TextElement (das ist im Grunde eine angefügte Eigenschaft, sondern dass neben dem Punkt).

Der wesentliche Vorteil dieses Ansatzes ist, dass anstelle der ContentPresenter mit einem TextBlock implizit davon ausgegangen, dass der header wird nur text enthalten, die Grenzen der Nutzbarkeit der Abhilfe und erzeugt einen weniger robusten code. Verlassen der ContentPresenter an Ort und Stelle können jegliche Inhalte, wie z.B. Bilder+text.

Eine weitere Sache, die Sie würden tun müssen, ist Ihren Namen ContentPresenter:
```
<Setter Property="Template">
     <Setter.Value>
         <ControlTemplate TargetType="{x:Type TabItem}">
             <Grid>
                <Border Name="Border" Padding="5,2">
                   <ContentPresenter x:Name="CP" ContentSource="Header"/>
                </Border>
             </Grid>
             <ControlTemplate.Triggers>
                <MultiTrigger>
                   <MultiTrigger.Conditions>
                      <Condition Property="Border.IsMouseOver" Value="True"/>
                      <Condition Property="IsSelected" Value="False"/>
                   </MultiTrigger.Conditions>
                     <Setter Property="TextElement.FontWeight" TargetName="CP" Value="Bold"/>
                     <Setter Property="TextElement.Foreground" TargetName="CP" Value="Black"/>                                
                </MultiTrigger>...
```
Nun die Vorder-und FontWeight nicht vererbt werden durch den Inhalt der TabItem (getestet).

Genießen 🙂

Dank Gilad, das ist auf jeden Fall eine viel bessere Lösung. Verlassen der ContentPresenter intakt ist definitiv der Weg zu gehen.
Ich habe nur dieses Beispiel zusammen. Aber der setter für TextElement.Foreground und TextElement.FontWeight haben keine Wirkung. Wenn ich auf add name grid für Raster und fügen Sie <Setter TargetName="grid" Property="Background" Value="red" /> der hintergrund rot wird.

InformationsquelleAutor Gilad
3

Dieser ist ziemlich alt, aber ich stieß auf ihn, während der Suche nach einer Lösung für ein ähnliches problem, und ich fand die gelieferten Antworten überhaupt nicht hilfreich.
Hier ist, wie ich das behoben.

Wenn Sie den ContentPresenter, um einen TextBlock in der Steuerelement-Vorlage von Ihrem tabitem, wie diese:
```
....stuff above here...
<ControlTemplate TargetType="{x:Type TabItem}">
<Grid>
   <Border Name="Border" Padding="5,2">
        <TextBlock x:Name="TabItemContent" Text="{TemplateBinding Header}"/>
   </Border>
</Grid>
... stuff below here....
```
Dann in Ihr auslösen, dass die Kontrolle Vorlage, die Sie angeben, den targetname im IsSelected trigger..dh.
```
...stuff above here...
 <Trigger Property="IsSelected" Value="True">
     <Setter Property="Foreground" TargetName="TabItemContent" Value="Green"/>
     <Setter Property="FontWeight" Value="Bold"/>
</Trigger>
... stuff below here ...
```
Das sollten Sie den grünen text, wenn das Register ausgewählt ist, und nicht grün, alle anderen Zeiten, während man den text einfärben der rest der app allein.

InformationsquelleAutor thornhill
3

Leider, wenn Sie die Vorder - (oder FontWeight) auf einem ContentPresenter durch einige trigger, die Sie immer noch davon ausgehen, dass der header wird nur Text enthalten.

Wenn Sie Header="SomeHeaderName" (also nur text), die ContentPresenter erzeugt einen TextBlock, der als host für diese headertext; der ContentPresenter werden die (logischen) Eltern von diesem TextBlock und so, die neue Vordergrundfarbe festgelegt, die auf der ContentPresenter geerbt von diesem TextBlock. Dies funktioniert ok.

Jedoch, wenn der Header zugeordnet ist, die einen Teil der visuellen Struktur, wie ein horizontales StackPanel-Element mit einem Bild und einem TextBlock (oder auch nur einen einzigen TextBlock), dann das logische übergeordnete Element StackPanel ist das TabItem-und nicht der ContentPresenter. Vererbung funktioniert über die logische Struktur und damit der TextBlock im StackPanel-Steuerelement wird letztlich seine Erben Vordergrund mit dem TabItem wieder; der Vordergrund, der festgelegt wurde auf den ContentPresenter hat keine Auswirkungen auf diese.

Eine mögliche Lösung: ein DataTemplate wird schließlich angewandt, um ein ContentPresenter, so die TemplatedParent der Wurzel des DataTemplate ist der ContentPresenter; und die Vererbung funktioniert durch eine TemplatedParent-Kind-Barriere sowie. Also, wenn Sie sind in der Lage, das TabItem.HeaderTemplate statt das TabItem.Header, dann kann Vordergrund, die auf der header ist ContentPresenter, da die Wurzel der HeaderTemplate wird Erben, die den Vordergrund vom ContentPresenter. Die SelectedContent jedoch nicht, weil der Vordergrund ist nicht festgelegt auf das TabItem (und den Inhalt übernimmt dessen Vordergrund von der TabItem).

Hoffe, das hilft!

InformationsquelleAutor Rob van Daal
0

Jedes control in wpf erbt Eigenschaften vom übergeordneten Element. Da das TabItem Farbe war schwarz, sein Kind textblock war ebenfalls von schwarzer Farbe. Nun, da hast du verändert die gesamte TabItem die Vordergrundfarbe auf grün, alle seine Kinder Erben werden.

Hier können Sie Ihre TabItem.Kopf oder dessen Inhalt in den Vordergrund zu grün, so dass es wird nicht auf andere Inhalte in das TabItem. Sonst können Sie invertieren die Lösung.

Anderes Versuchen:
```
<Window.Resources>
    <DataTemplate x:Key="greenHeaderTemplate">
        <StackPanel Orientation="Horizontal"> 
            <TextBlock Text="Profile" 
                       FontWeight="Bold" 
                       Foreground="Green"/> 
        </StackPanel> 
    </DataTemplate>
    <DataTemplate x:Key="defaultHeaderTemplate">
        <StackPanel Orientation="Horizontal"> 
            <TextBlock Text="Profile"/> 
        </StackPanel> 
    </DataTemplate>
</Window.Resources>

<Trigger Property="IsSelected" Value="True">      
    <Setter Property="HeaderTemplate" 
            Value="{StaticResource greenHeaderTemplate}"/> 
</Trigger>

<TabItem IsSelected="True" HeaderTemplate="{StaticResource defaultHeaderTemplate}"> 
    <TextBlock Text="Page 1 Sample Text with no foreground set." FontSize="30"/> 
</TabItem>
```
Dank Veer, aber wie kann ich die Farbe von dem tabitem header schriftart, ohne den Inhalt? Ich verstehe den targetname, aber ich habe versucht ein paar verschiedene Möglichkeiten, mit keine Freude. Ich erhalte eine Fehlermeldung, die besagt, dass der Vordergrund nicht festgelegt werden kann auf ein tabitem header.
Geben Sie einen Namen für das stackpanel-Element im header und verwenden Sie es in der target-Namen.
Leider muss ein Schmerz sein, aber ich habe versucht, und ich konnte es nicht zu funktionieren. Vielleicht mache ich es falsch (sehr wahrscheinlich!). Kannst du etwas code zeigen Sie mir? Dank
StackPanel-Steuerelement nicht über eine Foreground-Eigenschaft. Überprüfen Sie meine zu Bearbeiten.
Ich bin kämpfen, um zu sehen, wie dies funktionieren wird, weil in deinem Beispiel-code legen Sie die textblock-Farbe (durch targetname) in das tabitem vom Abzug. Jedes tabitem müssten dann geben Sie einen Namen für jeden textblock und dann die einzelnen bräuchte man einen separaten Auslöser. Bin ich hier etwas fehlt? Ich dachte, ich könnte einen trigger, der update würde jedes tabitem, wie und Wann erforderlich. Ich Schätze Ihre Hilfe so weit.

InformationsquelleAutor Amsakanna

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.