Оформление TabItem / WPF, Silverlight

ReSQL.ru

Мобильная версия Контакт Правила FAQ Помощь

Гость

Войти | Регистрация | Профиль | Очистить

Новые сообщения | Избранное

Форумы | Пользователи | Статистика | Мод. лог | Поиск

Доб. в избранное | Игнор. тему | Прикреп. тему | Пометить прочит. / непрочит. | Фильтр

Форумы / WPF, Silverlight [игнор отключен] [закрыт для гостей] / Оформление TabItem

8 сообщений из 8, страница 1 из 1

Оформление TabItem

#39100690

Oleg5555

Гость

Добрый день.

Помогите, пожалуйста, разобраться. Необходимо сделать очень маленькое изменение в оформлении TabItem. На TabControl я устанавливая фон в белый цвет. В результате сама вкладка, открытая (активная), приобретает белый фон. А фон заголовка вкладки остается без изменений (по умолчанию серый). Пришел к выводу, что для того чтобы всего лишь поменять один цвет фона на заголовке открытой вкладки нужно переписать стиль для TabItem. Описать все состояния IsSelected, IsEnabled, IsMouseOver и т. д. Куча разметки в которой к тому же будет задаваться строго определенные (а не системные цвета, которые в разных ос и при разных темах - разные) цвета для разных состояний. Но мне не нужно ничего менять кроме только фона заголока вкладки, которая в данный момент открыта. Просто установить одно это свойство в белый цвет (как и фон самой вклдаки), а все остальное оставить как есть в системе. Должно же это как-то несложно делаться. Подскажи как это сделать без переписывания всех стилей?

...

Рейтинг:

0 / 0

11.11.2015, 14:05

| Ответить | Цитировать | Написать

Оформление TabItem

#39100753

Roman Mejtes

Участник

Откуда: г. Пермь

Сообщения: 4 264

Рейтинг: 0 / 0

Oleg5555,

Код: xml

1.
2.
3.
4.
5.
6.
7.
8.
9.
10.
11.
12.
13.
14.
15.
16.
17.
18.
19.
20.
21.
22.
23.
24.
25.
26.
27.
28.
29.
30.
31.
32.
33.
34.
35.
36.
37.
38.
39.
40.
41.
42.
43.
44.
45.
46.
47.
48.
49.
50.
51.
52.
53.
54.
55.
56.
57.
58.
59.
60.
61.
62.
63.
64.
65.
66.
67.
68.
69.
70.
71.
72.
73.
74.
75.
76.
77.
78.
79.
80.
81.
82.
83.
84.
85.
86.
87.
88.
89.
90.
91.
92.
93.
94.
95.
96.
97.
98.
99.
100.
101.
102.
103.
104.
105.
106.
107.
108.
109.
110.
111.
112.
113.
114.
115.
116.
117.
118.
119.
120.
121.
122.
123.
124.
125.
126.
127.
128.
129.
130.
131.
132.
133.
134.
135.
136.
137.
138.
139.
140.

<Window x:Class="WpfApplication45.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        Title="MainWindow" Height="350" Width="525">
    <Window.Resources>
        <Style x:Key="TabItemFocusVisual">
            <Setter Property="Control.Template">
                <Setter.Value>
                    <ControlTemplate>
                        <Rectangle Margin="3,3,3,1" SnapsToDevicePixels="true" Stroke="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}" StrokeThickness="1" StrokeDashArray="1 2"/>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
        <SolidColorBrush x:Key="TabControlNormalBorderBrush" Color="#8C8E94"/>
        <LinearGradientBrush x:Key="ButtonNormalBackground" EndPoint="0,1" StartPoint="0,0">
            <GradientStop Color="#F3F3F3" Offset="0"/>
            <GradientStop Color="#EBEBEB" Offset="0.5"/>
            <GradientStop Color="#DDDDDD" Offset="0.5"/>
            <GradientStop Color="#CDCDCD" Offset="1"/>
        </LinearGradientBrush>
        <LinearGradientBrush x:Key="TabItemHotBackground" EndPoint="0,1" StartPoint="0,0">
            <GradientStop Color="#EAF6FD" Offset="0.15"/>
            <GradientStop Color="#D9F0FC" Offset=".5"/>
            <GradientStop Color="#BEE6FD" Offset=".5"/>
            <GradientStop Color="#A7D9F5" Offset="1"/>
        </LinearGradientBrush>
        <SolidColorBrush x:Key="TabItemSelectedBackground" Color="YellowGreen"/>
        <SolidColorBrush x:Key="TabItemHotBorderBrush" Color="#3C7FB1"/>
        <SolidColorBrush x:Key="TabItemDisabledBackground" Color="#F4F4F4"/>
        <SolidColorBrush x:Key="TabItemDisabledBorderBrush" Color="#FFC9C7BA"/>
        <Style TargetType="{x:Type TabItem}">
            <Setter Property="FocusVisualStyle" Value="{StaticResource TabItemFocusVisual}"/>
            <Setter Property="Foreground" Value="Black"/>
            <Setter Property="Padding" Value="6,1,6,1"/>
            <Setter Property="BorderBrush" Value="{StaticResource TabControlNormalBorderBrush}"/>
            <Setter Property="Background" Value="{StaticResource ButtonNormalBackground}"/>
            <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
            <Setter Property="VerticalContentAlignment" Value="Stretch"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type TabItem}">
                        <Grid SnapsToDevicePixels="true">
                            <Border x:Name="Bd" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="1,1,1,0" Background="{TemplateBinding Background}" Padding="{TemplateBinding Padding}">
                                <ContentPresenter x:Name="Content" ContentSource="Header" HorizontalAlignment="{Binding HorizontalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{Binding VerticalContentAlignment, RelativeSource={RelativeSource AncestorType={x:Type ItemsControl}}}"/>
                            </Border>
                        </Grid>
                        <ControlTemplate.Triggers>
                            <Trigger Property="IsMouseOver" Value="true">
                                <Setter Property="Background" TargetName="Bd" Value="{StaticResource TabItemHotBackground}"/>
                            </Trigger>
                            <Trigger Property="IsSelected" Value="true">
                                <Setter Property="Panel.ZIndex" Value="1"/>
                                <Setter Property="Background" TargetName="Bd" Value="{StaticResource TabItemSelectedBackground}"/>
                            </Trigger>
                            <MultiTrigger>
                                <MultiTrigger.Conditions>
                                    <Condition Property="IsSelected" Value="false"/>
                                    <Condition Property="IsMouseOver" Value="true"/>
                                </MultiTrigger.Conditions>
                                <Setter Property="BorderBrush" TargetName="Bd" Value="{StaticResource TabItemHotBorderBrush}"/>
                            </MultiTrigger>
                            <Trigger Property="TabStripPlacement" Value="Bottom">
                                <Setter Property="BorderThickness" TargetName="Bd" Value="1,0,1,1"/>
                            </Trigger>
                            <Trigger Property="TabStripPlacement" Value="Left">
                                <Setter Property="BorderThickness" TargetName="Bd" Value="1,1,0,1"/>
                            </Trigger>
                            <Trigger Property="TabStripPlacement" Value="Right">
                                <Setter Property="BorderThickness" TargetName="Bd" Value="0,1,1,1"/>
                            </Trigger>
                            <MultiTrigger>
                                <MultiTrigger.Conditions>
                                    <Condition Property="IsSelected" Value="true"/>
                                    <Condition Property="TabStripPlacement" Value="Top"/>
                                </MultiTrigger.Conditions>
                                <Setter Property="Margin" Value="-2,-2,-2,-1"/>
                                <Setter Property="Margin" TargetName="Content" Value="0,0,0,1"/>
                            </MultiTrigger>
                            <MultiTrigger>
                                <MultiTrigger.Conditions>
                                    <Condition Property="IsSelected" Value="true"/>
                                    <Condition Property="TabStripPlacement" Value="Bottom"/>
                                </MultiTrigger.Conditions>
                                <Setter Property="Margin" Value="-2,-1,-2,-2"/>
                                <Setter Property="Margin" TargetName="Content" Value="0,1,0,0"/>
                            </MultiTrigger>
                            <MultiTrigger>
                                <MultiTrigger.Conditions>
                                    <Condition Property="IsSelected" Value="true"/>
                                    <Condition Property="TabStripPlacement" Value="Left"/>
                                </MultiTrigger.Conditions>
                                <Setter Property="Margin" Value="-2,-2,-1,-2"/>
                                <Setter Property="Margin" TargetName="Content" Value="0,0,1,0"/>
                            </MultiTrigger>
                            <MultiTrigger>
                                <MultiTrigger.Conditions>
                                    <Condition Property="IsSelected" Value="true"/>
                                    <Condition Property="TabStripPlacement" Value="Right"/>
                                </MultiTrigger.Conditions>
                                <Setter Property="Margin" Value="-1,-2,-2,-2"/>
                                <Setter Property="Margin" TargetName="Content" Value="1,0,0,0"/>
                            </MultiTrigger>
                            <Trigger Property="IsEnabled" Value="false">
                                <Setter Property="Background" TargetName="Bd" Value="{StaticResource TabItemDisabledBackground}"/>
                                <Setter Property="BorderBrush" TargetName="Bd" Value="{StaticResource TabItemDisabledBorderBrush}"/>
                                <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
                            </Trigger>
                        </ControlTemplate.Triggers>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

    </Window.Resources>
    <UniformGrid Rows="2" Columns="2">
        <UniformGrid.Resources>
            <SolidColorBrush x:Key="{x:Static SystemColors.HighlightBrushKey}" Color="Green"/>
        </UniformGrid.Resources>
        <TabControl Background="YellowGreen">
            <TabItem Header="Tab1" Background="Bisque"  />
            <TabItem Header="Tab2" />
        </TabControl>
        <Button Content="Button"/>
        <Ellipse Width="100" Height="100" StrokeThickness="1" Stroke="Black"/>
        <StackPanel>
            <CheckBox Content="CheckBox"/>
            <RadioButton Content="RadioButton"/>
            <ListBox Margin="5">
                <ListBoxItem Content="Item 1"/>
                <ListBoxItem Content="Item 2"/>
                <ListBoxItem Content="Item 3"/>
                <ListBoxItem Content="Item 4"/>
                <ListBoxItem Content="Item 5"/>
                <ListBoxItem Content="Item 6"/>
            </ListBox>

        </StackPanel>
    </UniformGrid>
</Window>

...

Рейтинг:

0 / 0

11.11.2015, 14:49

| Ответить | Цитировать | Написать

Оформление TabItem

#39100825

Oleg5555

Гость

Спасибо за разметку. Могу узнать, это разметка соответствует стандартному оформлению или это Ваше, специфичное для конкретного приложение оформление? На вскидку видно, что, к примеру, цвет заголовка активной вкладки YellowGreen. Остальное тоже специфично? По коду цвет сразу сложно определить.

...

Рейтинг:

0 / 0

11.11.2015, 15:37

| Ответить | Цитировать | Написать

Оформление TabItem

#39100842

Roman Mejtes

Участник

Откуда: г. Пермь

Сообщения: 4 264

Рейтинг: 0 / 0

Oleg5555,

это копия оригинального шаблона, к сожалению цвета TabItem'а не привязаны к ресурсам, следовательно поменять их подменой ресурсов не получится. Приходится переопределить весь шаблон.

...

Рейтинг:

0 / 0

11.11.2015, 15:46

| Ответить | Цитировать | Написать

Оформление TabItem

#39100843

Oleg5555

Гость

И странно, в примере, если переключиться на вторую вкладку, то в первой устанавливается цвет фона #FFE4C4, что-то типо оранжевого. Но в разметке такого цвета нет.

...

Рейтинг:

0 / 0

11.11.2015, 15:46

| Ответить | Цитировать | Написать

Оформление TabItem

#39100856

Roman Mejtes

Участник

Откуда: г. Пермь

Сообщения: 4 264

Рейтинг: 0 / 0

Oleg5555И странно, в примере, если переключиться на вторую вкладку, то в первой устанавливается цвет фона #FFE4C4, что-то типо оранжевого. Но в разметке такого цвета нет.

Код: xml

 <TabItem Header="Tab1" >>Background="Bisque"<<  />

...

Рейтинг:

0 / 0

11.11.2015, 15:53

| Ответить | Цитировать | Написать

Оформление TabItem

#39100889

Oleg5555

Гость

Все, извиняюсь. Разобрался.

...

Рейтинг:

0 / 0

11.11.2015, 16:05

| Ответить | Цитировать | Написать

Оформление TabItem

#39100890

Oleg5555

Гость

Большое спасибо!

...

Рейтинг:

0 / 0

11.11.2015, 16:06

| Ответить | Цитировать | Написать

8 сообщений из 8, страница 1 из 1

Форумы / WPF, Silverlight [игнор отключен] [закрыт для гостей] / Оформление TabItem

Цитировать

Написать

Автор*:

Ввести пароль для входа

Тема*:

Сообщение

Данное сообщение тематическое

Сообщение содержит картинки или видео 18+

Автор:

ВНИМАНИЕ! На данном подфоруме действуют строгие правила. Удостоверьтесь, что ваше сообщение соответствует им!

Форум или тема закрыты для гостей. Необходима авторизация!

Загрузить последнюю сохраненную версию

Вложение:

Вставить как галерею

Максимальный размер вложений: 4,0 МБ, аудио/видео: 8,0 МБ. Картинки большего размера ужимаются, если возможно.

Введите код, изображенный на картинке. Если код нечитаемый, кликните картинку, чтобы загрузить другой вариант.

Отправляя сообщение, я выражаю свое согласие с правилами форума и принимаю пользовательское соглашение.

Читали тему (0):

Читали форум (0):

Пользователи онлайн (0):

start [/forum/search_topic.php?author=A%D0%9DT0H&author_mode=last_topics&do_search=1]:	0ms
get settings:	8ms
get forum list:	13ms
get settings:	10ms
get forum list:	13ms
check forum access:	4ms
check topic access:	4ms
track hit:	148ms
get topic data:	11ms
get forum data:	2ms
get page messages:	50ms
get tp. blocked users:	2ms
others:	85ms

total:	350ms