溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點(diǎn)擊 登錄注冊 即表示同意《億速云用戶服務(wù)條款》

C#中WPF依賴屬性的正確學(xué)習(xí)方法

發(fā)布時(shí)間:2020-10-11 16:19:03 來源:腳本之家 閱讀:290 作者:Kiba518 欄目:編程語言

前言

我在學(xué)習(xí)WPF的早期,對(duì)依賴屬性理解一直都非常的不到位,其惡果就是,我每次在寫依賴屬性的時(shí)候,需要翻過去的代碼來復(fù)制黏貼。

相信很多朋友有著和我相同的經(jīng)歷,所以這篇文章希望能幫助到那些剛剛開始學(xué)依賴屬性的朋友。

那些[討厭]的依賴屬性的講解文章

初學(xué)者肯定會(huì)面臨一件事,就是百度,谷歌,或者M(jìn)SDN來查看依賴屬性的定義和使用,而這些文章雖然都寫的很好,但,那是相對(duì)于已經(jīng)學(xué)會(huì)使用依賴屬性的朋友而言。

而對(duì)于初學(xué)者而言,說是誤導(dǎo)都不過分。

比如,官網(wǎng)的這篇文章https://docs.microsoft.com/zh-cn/dotnet/framework/wpf/advanced/dependency-properties-overview

介紹依賴屬性是這樣。

public static readonly DependencyProperty IsSpinningProperty =
  DependencyProperty.Register(
  "IsSpinning", typeof(Boolean),
  typeof(MyCode)
  );
public bool IsSpinning
{
  get { return (bool)GetValue(IsSpinningProperty); }
  set { SetValue(IsSpinningProperty, value); }
}

他做了一個(gè)定義,然后告訴你,依賴屬性的定義格式如此。

如果你是個(gè)初學(xué)者,你想不疑惑都很難。因?yàn)闆]人能把這種定義給背下來。

其結(jié)果就是,你要和我當(dāng)初一樣,每次定義依賴屬性,都要去復(fù)制黏貼。但這并不是最大的惡果,最大的惡果是,因?yàn)樘^復(fù)雜的定義,讓你放棄了對(duì)他理解,就記住了依賴屬性要復(fù)制黏貼,從而導(dǎo)致了,你喪失了對(duì)依賴屬性靈活運(yùn)用的能力。

正確的理解依賴屬性

如何正確的理解依賴屬性呢?

很簡單,拆分一下就可以理解了。

現(xiàn)在我們來拆分依賴屬性,首先拆分他的定義,將依賴和屬性拆分。

我們先看屬性,如下,我們定義了一個(gè)屬性。

private bool _IsSpinning;
public bool IsSpinning
{
  get { return _IsSpinning; }
  set { _IsSpinning = value; }
}

然后我們使用DependencyProperty類定義一個(gè)對(duì)象,這個(gè)對(duì)象將作為IsSpinning屬性的依賴,如下:

public static readonly DependencyProperty IsSpinningProperty

然后,我們在將這個(gè)依賴對(duì)象,注冊到屬性IsSpinning的所在類上,如下:

DependencyProperty.Register( "IsSpinning", typeof(bool), typeof(你的屬性所在的類的名稱));

從注冊代碼中,我們可以看到,他注冊了三個(gè)信息:

1,當(dāng)前DependencyProperty類定義的對(duì)象IsSpinningProperty,依賴于屬性IsSpinning。

2,對(duì)象IsSpinningProperty的依賴類型與屬性IsSpinning的類型一樣都是bool。

3,對(duì)象IsSpinningProperty注冊的類是聲明屬性IsSpinning的類,即,在其他類里,將看不到該依賴對(duì)象。

現(xiàn)在,我們做最后的操作,修改屬性,將依賴對(duì)象IsSpinningProperty與屬性IsSpinning綁定。

如何綁定呢?很簡單,將我們屬性定義里的【private bool _IsSpinning】替換為我們剛剛定義的依賴【IsSpinningProperty】即可。

public bool IsSpinning
{
  get { return (bool)GetValue(IsSpinningProperty); }
  set { SetValue(IsSpinningProperty, value); }
}

這里我們看到了,在給屬性賦值和取值時(shí),用到了GetValue和SetValue,他們倆是哪來的呢?

使用F12,我們跟蹤進(jìn)去,發(fā)現(xiàn)它們是類DependencyProperty里定義的方法,那么為什么我們在窗體里也可以用呢?

很簡單,我們跟進(jìn)一下Window的父類,發(fā)現(xiàn)最后的父類Visual繼承了DependencyProperty,所以我們可以直接使用GetValue和SetValue來賦值和獲取依賴對(duì)象的值。也就是只要是繼承了類DependencyProperty的子類,都可以使用依賴屬性。

完整版依賴屬性定義代碼:

public static readonly DependencyProperty IsSpinningProperty =
DependencyProperty.Register("IsSpinning", typeof(bool), typeof(DependecyUserControl));
public bool IsSpinning
{
  get { return (bool)GetValue(IsSpinningProperty); }
  set { SetValue(IsSpinningProperty, value); }
}

到這里,依賴屬性的拆分就完事了,現(xiàn)在,大家應(yīng)該很清楚依賴屬性到底是什么了吧。

現(xiàn)在你已經(jīng)理解這些依賴屬性的概念了,只要熟練一點(diǎn)點(diǎn),實(shí)現(xiàn)手敲依賴屬性已經(jīng)不是夢了。

PS:有沒有人曾經(jīng)告訴你,依賴屬性的命名必須是 屬性名+Property,然后你還信以為真了。哈哈。

依賴屬性的簡單應(yīng)用

現(xiàn)在讓我們來自定義一個(gè)帶依賴屬性的系統(tǒng)控件來加深記憶。

public class KButton : Button 
{
  public static readonly DependencyProperty ForeImageProperty;
  public static readonly DependencyProperty BackImageProperty;
  public static readonly DependencyProperty MouseOverBackColorProperty;
  public static readonly DependencyProperty StretchProperty; 
  static KButton()
  {
    ForeImageProperty = DependencyProperty.Register("ForeImage", typeof(string), typeof(KButton),null);
    ForeImageProperty = DependencyProperty.Register("BackImage", typeof(string), typeof(KButton),null);
    MouseOverBackColorProperty = DependencyProperty.Register("MouseOverBackColor", typeof(Brush), typeof(KButton), null);
    StretchProperty = DependencyProperty.Register("Stretch", typeof(Stretch), typeof(KButton), null);
    DefaultStyleKeyProperty.OverrideMetadata(typeof(KButton), new FrameworkPropertyMetadata(typeof(KButton)));//使KButton去讀取KButton類型的樣式,而不是去讀取Button的樣式
  }
  public string ForeImage
  {
    get { return (string)GetValue(ForeImageProperty); }
    set { SetValue(ForeImageProperty, value); }
  }
  public string BackImage
  {
    get { return (string)GetValue(BackImageProperty); }
    set { SetValue(BackImageProperty, value); }
  }
  public Brush MouseOverBackColor
  {
    get { return (Brush)GetValue(MouseOverBackColorProperty); }
    set { SetValue(MouseOverBackColorProperty, value); }
  }
  public Stretch Stretch
  {
    get { return (Stretch)GetValue(StretchProperty); }
    set { SetValue(StretchProperty, value); }
  } 
}

如上述代碼所示,我們定義了一個(gè)繼承至Button的類KButton。

在KButtion中,我們定義了四個(gè)依賴屬性:

ForeImageProperty:按鈕的前景圖片。

BackImageProperty:按鈕的背景圖片。

MouseOverBackColorProperty:按鈕在鼠標(biāo)經(jīng)過時(shí)的顏色。

StretchProperty:按鈕圖片的拉伸模式。

代碼非常簡潔,除了四個(gè)依賴屬性之外,什么也沒有;現(xiàn)在我們?nèi)ザxKbutton類型的樣式。

為了演示方便,我直接將樣式定義在了App.xaml文件內(nèi)。

<Style TargetType="{x:Type local:KButton}">
  <Setter Property="Template">
    <Setter.Value>
      <ControlTemplate>
        <DockPanel Name="dpCon" Width="{Binding Width, RelativeSource={x:Static RelativeSource.TemplatedParent}}"
            Height="{Binding Height, RelativeSource={x:Static RelativeSource.TemplatedParent}}"
            Background="{Binding Background, RelativeSource={x:Static RelativeSource.TemplatedParent}}"
            ToolTip="{Binding ToolTip, RelativeSource={x:Static RelativeSource.TemplatedParent}}"
            >
          <DockPanel DockPanel.Dock="Top" Name="dpBtn">
            <DockPanel.Background>
              <ImageBrush ImageSource="{Binding ForeImage, RelativeSource={x:Static RelativeSource.TemplatedParent}}" Stretch="{Binding Stretch,RelativeSource={x:Static RelativeSource.TemplatedParent}}"/>
            </DockPanel.Background>
            <TextBlock FontSize="15" VerticalAlignment="Center" HorizontalAlignment="Center" Foreground="#f9fcff" Text="{Binding Content, RelativeSource={x:Static RelativeSource.TemplatedParent}}"></TextBlock>
          </DockPanel>
        </DockPanel>
        <ControlTemplate.Triggers> 
          <DataTrigger Binding="{Binding IsMouseOver,RelativeSource={x:Static RelativeSource.Self}}" Value="True">
            <Setter Property="Background" TargetName="dpBtn">
              <Setter.Value>
                <ImageBrush ImageSource="{Binding BackImage, RelativeSource={x:Static RelativeSource.TemplatedParent}}" Stretch="{Binding Stretch,RelativeSource={x:Static RelativeSource.TemplatedParent}}"/>
              </Setter.Value>
            </Setter>
            <Setter Property="Background" TargetName="dpCon" Value="{Binding MouseOverBackColor, RelativeSource={x:Static RelativeSource.TemplatedParent}}"></Setter>
          </DataTrigger>
          <DataTrigger Binding="{Binding BackImage,RelativeSource={x:Static RelativeSource.Self},Mode=TwoWay}" Value="{x:Null}">
            <Setter Property="Background" TargetName="dpBtn">
              <Setter.Value>
                <ImageBrush ImageSource="{Binding ForeImage, RelativeSource={x:Static RelativeSource.TemplatedParent}}" Stretch="{Binding Stretch,RelativeSource={x:Static RelativeSource.TemplatedParent}}"/>
              </Setter.Value>
            </Setter> 
          </DataTrigger>
          <Trigger Property="IsEnabled" Value="true"/>
          <Trigger Property="IsEnabled" Value="false">
            <Setter Property="Foreground" Value="Gray"/>
          </Trigger>
        </ControlTemplate.Triggers>
      </ControlTemplate>
    </Setter.Value>
  </Setter>
</Style>

樣式代碼如上所示,也非常簡單,就是定義了一個(gè)模板,然后在模板里擺放好按鈕背景圖和按鈕文字的位置。然后將我們之前定義好的依賴屬性綁定到對(duì)應(yīng)的值上。

其中需要注意的是,在模板中綁定自定義依賴屬性,是使用RelativeSource.TemplatedParent的,如

{Binding ForeImage,

RelativeSource={x:Static RelativeSource.TemplatedParent}}。

而在模板的數(shù)據(jù)事件DataTrigger中,綁定依賴屬性的模式卻是分兩種的。

第一種,綁定數(shù)據(jù)事件DataTrigger的條件時(shí),使用RelativeSource.Self,如{Binding IsMouseOver,RelativeSource={x:Static RelativeSource.Self}}。

第二種,條件成立,觸發(fā)模板變化時(shí),使用RelativeSource.TemplatedParent,如{Binding BackImage, RelativeSource={x:Static RelativeSource.TemplatedParent}}。

----------------------------------------------------------------------------------------------------

現(xiàn)在我們使用下我們制作好的自定義控件,代碼如下所示:

<DockPanel>
  <StackPanel>
    <local:KButton Height="50" Width="50" Stretch="None" ForeImage="/Image/關(guān)閉.png" BackImage="/Image/關(guān)閉退出.png" Background="Gray" MouseOverBackColor="Brown"/>
    <local:KButton Height="50" Width="50" Margin="0,10,0,0" Stretch="None" ForeImage="/Image/關(guān)閉.png" Background="Gray" MouseOverBackColor="Brown"/>
    <local:KButton Height="100" Width="100" Margin="0,10,0,0" Content="籃子" Stretch="Fill" ForeImage="/Image/籃子.png" Background="Gray" MouseOverBackColor="Brown"/>
  </StackPanel> 
</DockPanel>

界面效果如下:

C#中WPF依賴屬性的正確學(xué)習(xí)方法

自定義用戶控件中使用依賴屬性

首先我們添加新項(xiàng),然后選擇用戶控件。

C#中WPF依賴屬性的正確學(xué)習(xí)方法

然后,我們添加一個(gè)依賴屬性HeaderTitle,同時(shí)設(shè)置當(dāng)前控件的DataContext為自身—this.DataContext = this。

public string HeaderTitle
{
  get { return (string)GetValue(HeaderTitleProperty); }
  set { SetValue(HeaderTitleProperty, value); }
} 
public static readonly DependencyProperty HeaderTitleProperty = DependencyProperty.Register("HeaderTitle", typeof(string), typeof(DependecyUserControl), null); 
public DependecyUserControl()
{
  this.DataContext = this;
  InitializeComponent();
}

現(xiàn)在,我們在用戶控件的Xaml頁面添加一個(gè)TextBlock,并綁定他的Text為我們剛剛定義的HeaderTitle,代碼如下所示。

<Grid>
  <TextBlock Text = "{Binding HeaderTitle}" TextAlignment="Center"></TextBlock>
</Grid>

接著我們回到主窗體,引用這個(gè)用戶控件,代碼如下所示:

<local:DependecyUserControl Height = "30" HeaderTitle="我是Header" DockPanel.Dock="Top"></local:DependecyUserControl>

運(yùn)行結(jié)果:

C#中WPF依賴屬性的正確學(xué)習(xí)方法

可以看到,我們成功在主頁面設(shè)置了用戶控件的依賴屬性,并讓他成功的綁定到了用戶控件中的TextBlock的Text屬性。也就是說,我們簡單的實(shí)現(xiàn)了Header的Title動(dòng)態(tài)設(shè)置。

結(jié)語

WPF擁有非常強(qiáng)大的自定義能力,而,正確的學(xué)會(huì)了依賴屬性是體會(huì)到它強(qiáng)大的第一步。

----------------------------------------------------------------------------------------------------

到此WPF依賴屬性的正確學(xué)習(xí)方法就已經(jīng)講解完成了。

代碼已經(jīng)傳到Github上了,歡迎大家下載。

Github地址:https://github.com/kiba518/WpfDependency

總結(jié)

以上所述是小編給大家介紹的C#中WPF依賴屬性的正確學(xué)習(xí)方法,希望對(duì)大家有所幫助,如果大家有任何疑問請(qǐng)給我留言,小編會(huì)及時(shí)回復(fù)大家的。在此也非常感謝大家對(duì)億速云網(wǎng)站的支持!
如果你覺得本文對(duì)你有幫助,歡迎轉(zhuǎn)載,煩請(qǐng)注明出處,謝謝!

向AI問一下細(xì)節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點(diǎn)不代表本網(wǎng)站立場,如果涉及侵權(quán)請(qǐng)聯(lián)系站長郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI