Возможно ли на основе определения местоположения в WPF? - PullRequest
Новая
       15

Возможно ли на основе определения местоположения в WPF?

6 голосов
/ 14 июля 2011

В CSS можно стилизовать HTML-элементы на основе их расположения в дереве элементов: 

div#container div#menu a

Я бы хотел сделать то же самое в WPF, чтобы стилизовались только ссылки в разделе меню.

  • Вопрос № 1: Так или иначе, возможно ли вышеизложенное в WPF?

Я думал о следующем для разделителей, вложенных в StatusBar: 

<Style TargetType="{x:Type StatusBar}">
    <Setter Property="Background" Value="Transparent" />
    <Setter Property="Padding" Value="0,0,20,0" />
    <Style.Resources>
        <Style TargetType="{x:Type Separator}">
            <Setter Property="Width" Value="20" />
            <Setter Property="Background" Value="Green" />
        </Style>
    </Style.Resources>
</Style>

Эта часть XAML включена в словарь ресурсов. StatusBar отображается с прозрачным фоном и правильным заполнением. Однако зеленый разделитель, к сожалению, не отображается. Он просто показывает стандартную серую полосу шириной 1px.

  • Вопрос № 2: Если это правильное решение, кто-нибудь знает, почему это не работает?

Заранее спасибо.

Ответы [ 3 ]

2 голосов
/ 14 июля 2011

Это, конечно, возможно. Взгляните на http://www.klopfenstein.net/lorenz.aspx/nested-cascading-styles-in-wpf

1 голос
/ 15 июля 2011

Наткнулся на ответ сам. Код, который я упомянул, является правильным для каждого случая, кроме Разделителя. Элемент Separator должен иметь определенный ключ, подробное описание которого приведено здесь: http://devlicio.us/blogs/christopher_bennage/archive/2008/06/19/styling-separators-in-wpf.aspx.

0 голосов
/ 14 июля 2011

Некоторое время назад я написал сообщение в блоге, в котором я взял механизм выбора CSS (Fizzler) и применил его к WPF:

http://www.scottlogic.co.uk/blog/colin/2009/03/using-css-selectors-for-styling-in-wpf/

Это позволяет использовать селекторы CSS дляцелевые элементы и применять к ним стили.Он также объединяет стили, так что если совпадают несколько селекторов CSS, стили каждого из них объединяются.

См. Следующий пример: 

<css:StyleSheet x:Key="cssStyles">
    <css:StyleSheet.Rules>

        <css:StyleRule Selector=".form Grid *" SelectorType="LogicalTree">
            <css:StyleRule.DeclarationBlock>
                <css:StyleDeclarationBlock>
                    <css:StyleDeclaration Property="Margin" Value="4,4,4,4"/>
                </css:StyleDeclarationBlock>
            </css:StyleRule.DeclarationBlock>
        </css:StyleRule>

        <css:StyleRule Selector=".form TextBlock.mandatory">
            <css:StyleRule.DeclarationBlock>
                <css:StyleDeclarationBlock>
                    <css:StyleDeclaration Property="Foreground" Value="Red"/>
                </css:StyleDeclarationBlock>
            </css:StyleRule.DeclarationBlock>
        </css:StyleRule>

        <css:StyleRule Selector="Border.form">
            <css:StyleRule.DeclarationBlock>
                <css:StyleDeclarationBlock>
                    <css:StyleDeclaration Property="BorderThickness" Value="2"/>
                    <css:StyleDeclaration Property="BorderBrush" Value="Black"/>
                    <css:StyleDeclaration Property="CornerRadius" Value="5"/>
                    <css:StyleDeclaration Property="Margin" Value="10,10,10,10"/>
                </css:StyleDeclarationBlock>
            </css:StyleRule.DeclarationBlock>
        </css:StyleRule>

        <css:StyleRule Selector=".form .title">
            <css:StyleRule.DeclarationBlock>
                <css:StyleDeclarationBlock>
                    <css:StyleDeclaration Property="HorizontalAlignment" Value="Stretch"/>
                    <css:StyleDeclaration Property="HorizontalContentAlignment" Value="Center"/>
                    <css:StyleDeclaration Property="Background" Value="DarkBlue"/>
                    <css:StyleDeclaration Property="Foreground" Value="White"/>
                    <css:StyleDeclaration Property="FontSize" Value="13"/>
                    <css:StyleDeclaration Property="Padding" Value="3,3,3,3"/>
                    <css:StyleDeclaration Property="FontWeight" Value="Bold"/>
                </css:StyleDeclarationBlock>
            </css:StyleRule.DeclarationBlock>
        </css:StyleRule>

    </css:StyleSheet.Rules>
</css:StyleSheet>
...