Двойная граница с VisualBrush в WPF - PullRequest
Новая
       16

Двойная граница с VisualBrush в WPF

0 голосов
/ 12 марта 2010

Мне любопытно, если кто-нибудь знает способ легко получить эффект двойной границы в WPF, подобный тому, что вы видите в выбранных элементах в проводнике Windows в Windows 7.

Example of what I'm looking for

Если вы присмотритесь, вы заметите, что выбранный элемент имеет темную границу, более светлую внутреннюю границу, а затем градиентный фон.

В настоящее время я использую две границы вокруг объекта в любое время, когда хочу добиться этого эффекта. Делать это таким образом уродливо синтаксически и действительно запутывает мой взгляд xaml. Будучи веб-разработчиком в глубине души, я бы хотел максимально отделить структуру xaml от стиля. Итак, я начал вставлять это в стили и шаблоны контента, чтобы вытащить это из моего поля зрения xaml.

Однако мне любопытно, может быть, есть лучший способ сделать это.

Я немного поиграл, используя VisualBrush в качестве фона, чтобы попытаться получить эффект. Тем не менее, я хочу иметь возможность применять фон к элементам, которые могут быть любого размера, и то, как VisualBrush растягивал визуальный элемент, чтобы соответствовать фону элемента, не работал так, как я хотел. По сути, мне бы очень хотелось растянуть изображение так, как это сделала бы система макетов WPF.

Любые идеи будут с благодарностью.

- Дасти

1 Ответ

1 голос
/ 12 марта 2010

VisualBrush, вероятно, не то, что вы хотите делать в этом сценарии, так как он довольно тяжелый.

Вы можете решить проблему с некоторыми Xaml без вложения границ.

Например, 

<Border BorderBrush="#FF00B5C5" BorderThickness="1" CornerRadius="2" Background="White">
   <Grid Background="#FF00B5C5" Margin="1">
     <Rectangle Fill="#FFA2F2FE" />
     <TextBlock Text="This is some text" VerticalAlignment="Center"/>
   </Grid>
</Border>

Конечно, вы можете настроить свойства, чтобы получить нужный вам вид.

РЕДАКТИРОВАТЬ: Если вы хотите создать стиль, чтобы вы могли изменить внешний вид, вы можете сделать что-то вроде этого: 

<Window.Resources>
    <Style x:Key="BorderedTextBlock" TargetType="ContentControl">
        <Setter Property="ContentTemplate">
            <Setter.Value>
                <DataTemplate>
                    <Border BorderBrush="#FF00B5C5" BorderThickness="1" CornerRadius="2" Background="White"> 
                       <Grid Background="#FF00B5C5" Margin="1"> 
                         <Rectangle Fill="#FFA2F2FE" /> 
                         <TextBlock Text="{Binding}" VerticalAlignment="Center"/> 
                       </Grid> 
                    </Border>
                </DataTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</Window.Resources>

<Grid x:Name="LayoutRoot">
    <ContentControl Style="{StaticResource BorderedTextBlock}" Content="This is some text" Width="200" Height="24"/>
</Grid>

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

Надеюсь, это поможет,

Sergio

...