簡體   English   中英

用戶控件中的c#wpf樣式控件

[英]c# wpf Style Control in UserControl

我有一個帶UserControl的MainWindow。 我想更改位於UserControl中的ListBox的背景。 但是,樣式僅應用於UserControl,而不應用於內部控件。

稍后我想從外部修改ListBoxItems。

主窗口

<Window x:Class="WpfApplication1.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:local="clr-namespace:WpfApplication1"
    mc:Ignorable="d"
    Title="MainWindow" Height="279.716" Width="279.784"
    DataContext="{Binding RelativeSource={RelativeSource Self}}">
<Window.Resources>

</Window.Resources>
<Grid>
    <Grid.Resources>
        <Style TargetType="{x:Type local:UserControl1}">
            <Setter Property="Background" Value="Black"></Setter>
            <Style.Resources>
                <Style TargetType="{x:Type ListBox}">
                    <Setter Property="Background" Value="Red"></Setter>
                </Style>
            </Style.Resources>
        </Style>
    </Grid.Resources>
    <local:UserControl1 Margin="47,22,34,46"></local:UserControl1>
</Grid>

XAML

<UserControl x:Class="WpfApplication1.UserControl1"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         xmlns:local="clr-namespace:WpfApplication1"
         mc:Ignorable="d" 
         d:DesignHeight="300" d:DesignWidth="300">
<Grid>
    <ListBox Background="Aqua" x:Name="listBox" HorizontalAlignment="Left" Height="192" Margin="54,44,0,0" VerticalAlignment="Top" Width="192"/>

</Grid>

預習

您實際上不需要那種樣式。 您必須將ListBox的background屬性綁定到UserControl的background屬性:

<UserControl x:Class="TestAppWPFStackOverFlow.UserControl1"
         xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
         xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
         xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
         xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
         xmlns:local="clr-namespace:TestAppWPFStackOverFlow"
         mc:Ignorable="d" 
         d:DesignHeight="300" d:DesignWidth="300">
<Grid>
    <ListBox Background="{Binding RelativeSource={RelativeSource Mode=FindAncestor, AncestorType={x:Type UserControl}}, Path=Background}" x:Name="listBox" HorizontalAlignment="Left" Height="192" Margin="54,44,0,0" VerticalAlignment="Top" Width="192"/>
</Grid>

呼叫者應該看起來像:

 <Window x:Class="TestAppWPFStackOverFlow.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:TestAppWPFStackOverFlow"
        mc:Ignorable="d"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <local:UserControl1 Margin="47,22,34,46" Background="Brown"></local:UserControl1>
    </Grid>
</Window>

結果是:

在此處輸入圖片說明

如果要將樣式用於所有自定義控件的背景,則應使用此部分代碼(應用建議的方法之后):

 <Style TargetType="{x:Type local:UserControl1}">
            <Setter Property="Background" Value="Red"></Setter>
        </Style>

現在,如果要更改項目的背景,則要復雜一些。 您必須為ListBoxItem項目創建樣式,該樣式應如下所示:

<Style TargetType="{x:Type ListBoxItem}">
            <Setter Property="Background" Value="Yellow" />
        </Style>

但是您可能希望從控件外部控制顏色,因此需要一個依賴項屬性。

在UserControl1.xaml.cs中,您必須定義:

public static readonly DependencyProperty ItemsBackgroundProperty =
          DependencyProperty.Register("ItemsBackground", typeof(string), typeof(UserControl1),
              new FrameworkPropertyMetadata());


        public string ItemsBackground
        {
            get { return (string)GetValue(ItemsBackgroundProperty); }
            set { SetValue(ItemsBackgroundProperty, value); }
        }

並且樣式將被修改為使用此屬性:

   <UserControl.Resources>
        <Style TargetType="{x:Type ListBoxItem}">
            <Setter Property="Background" Value="{Binding RelativeSource={RelativeSource Mode=FindAncestor,
                                                                     AncestorType={x:Type UserControl}},
                                      Path=ItemsBackground}" />
        </Style>
    </UserControl.Resources>

現在,您唯一需要設置的就是使用控件時的以下屬性:

 <local:UserControl1 Margin="47,22,34,46" ItemsBackground="Yellow" ></local:UserControl1>

結果 :

在此處輸入圖片說明

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM