8天入門wpf—— 第八天 最后的補充

 

 

    從這一篇往前看，其實wpf中還有很多東西沒有講到，不過我的原則還是將比較常用的知識點過一遍，如果大家熟悉了這些知識，基本功

也就打的差不多了，后續可以等待老鄧的wpf細說系列，這里我先頂老鄧一下。

 

一：用戶控件(UserControl）

      對於用戶控件的認識，我想大家還是很熟悉的，因為這玩意我們在webform或者在mvc中用的可多了，我們看看wpf中怎么使用，首先

我們要知道"用戶控件“繼承自UserControl,而UserControl繼承自ContentControl,也就是上上一篇說的”內容控件”。

 

第一步：在vs中的添加項中找到一個“用戶控件WPF”，點擊添加即可。

第二步：我們發現其實UserControl和Window是一個層次上的，都有xaml和cs文件，然后我們在xaml中拖幾個控件。

<UserControl x:Class="WpfApplication8.AddProduct"
             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" 
             mc:Ignorable="d" 
             d:DesignHeight="200" d:DesignWidth="300">
    <Grid Height="171" Width="262">
        <TextBlock Height="20" HorizontalAlignment="Left" Margin="28,57,0,0" Name="textBlock1" Text="名稱:" VerticalAlignment="Top" Width="42" />
        <TextBlock Height="20" HorizontalAlignment="Left" Margin="28,92,0,0" Name="textBlock2" Text="價格:" VerticalAlignment="Top" Width="42" />
        <TextBox Height="23" HorizontalAlignment="Left" Margin="76,54,0,0" Name="textBox1" VerticalAlignment="Top" Width="120" />
        <TextBox Height="23" HorizontalAlignment="Left" Margin="76,92,0,0" Name="textBox2" VerticalAlignment="Top" Width="120" />
    </Grid>
</UserControl>

第三步：我們在MainWindow中引用，跟webform中使用套路一模一樣，最后也就ok了。

<Window x:Class="WpfApplication8.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:WpfApplication8"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <local:AddProduct x:Name="test"/>
    </Grid>
</Window>

 

二：資源文件

     先前文章我也說過，資源就類似於webform中的css，但是實際應用中，css都是一個個單獨的文件來實現內容與樣式的分離，當然

wpf中也主張這么做。

 

第一步：vs中新建項 -> 資源字典->點擊確定

 

第二步：這里我就將默認生成的Dictionary1.xaml放在解決方案的Style文件夾下，然后我們寫上一段簡單的style。

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
    <Style x:Key="backColor" TargetType="{x:Type Button}">
        <Setter Property="Background" Value="Red"/>
    </Style>
</ResourceDictionary>

 

第三步：在Resources上引用，指定資源文件路徑，跟webform中的css文件引用一樣一樣的。

<Window x:Class="WpfApplication9.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>
        <!-- 引用外部資源文件 -->
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="/Style/Dictionary1.xaml"/>
            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Window.Resources>
    <Grid>
        <Button Content="Button" Style="{StaticResource ResourceKey=backColor}" Height="23" HorizontalAlignment="Left" Margin="104,58,0,0" Name="button1" VerticalAlignment="Top" Width="75" />
    </Grid>
</Window>

 

三：了解wpf中Window的生命周期

   了解生命周期，可以讓我們更好的控制生命周期內各個階段發生的行為，具體怎么靈活運用，得要看大家靈活發揮了。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using System.Diagnostics;

namespace WpfApplication10
{
    /// <summary>
    /// MainWindow.xaml 的交互邏輯
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();

            //初始化
            this.Initialized += (sender, e) =>
            {
                Debug.WriteLine("窗體初始化完成 Initialized");
            };

            //激活
            this.Activated += (sender, e) =>
            {
                Debug.WriteLine("窗體被激活 Activated");
            };

            //加載
            this.Loaded += (sender, e) =>
            {
                Debug.WriteLine("窗體加載完成 Loaded");
            };

            //呈現內容
            this.ContentRendered += (sender, e) =>
            {
                Debug.WriteLine("呈現內容 ContentRendered");
            };

            //失活
            this.Deactivated += (sender, e) =>
            {
                Debug.WriteLine("窗體被失活 Deactivated");
            };

            //窗體獲取輸入焦點
            this.GotFocus += (sender, e) =>
            {
                Debug.WriteLine("窗體獲取輸入焦點 GotFocus");
            };

            //窗體失去輸入焦點
            this.LostFocus += (sender, e) =>
            {
                Debug.WriteLine("窗體失去輸入焦點 LostFocus");
            };

            //鍵盤獲取輸入焦點
            this.GotKeyboardFocus += (sender, e) =>
            {
                Debug.WriteLine("鍵盤獲取輸入焦點 GotKeyboardFocus");
            };

            //鍵盤失去輸入焦點
            this.LostKeyboardFocus += (sender, e) =>
            {
                Debug.WriteLine("鍵盤失去輸入焦點 LostKeyboardFocus");
            };

            //正在關閉
            this.Closing += (sender, e) =>
            {
                Debug.WriteLine("窗體正在關閉 Closeing");
            };

            //關閉
            this.Closed += (sender, e) =>
            {
                Debug.WriteLine("窗體正在關閉 Closed");
            };

        }
    }
}

從窗體的開啟到關閉，我們可以在“輸出窗口”中看到如下的事件發生順序流。

 

四：屬性更改通知（INotifyPropertyChanged）

     我們在開發webform中，如果刪除GridView里面的一行，我們的作法肯定就是在數據庫中刪除掉選定的記錄然后重新綁定GridView控件

來實現我們的需求，注意，這里有“重新綁定”一詞，但是在wpf中有一個突破，前一篇文章我也提到過wpf中的ObservableCollection<T>，

MSDN中說，在添加項，移除項時此集合通知控件，我們知道對一個集合的操作是CURD，但是恰恰沒有Update的時候提供集合通知，也就

是說當我Update的時候，雖然"集合內容“已被修改，但是"控件“卻沒有實現同步更新，怎么辦呢？INotifyPropertyChanged提供了解決方案。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;
using System.Collections.ObjectModel;
using System.Windows.Controls.Primitives;
using System.ComponentModel;

namespace ListViewDemo
{
    /// <summary>
    /// MainWindow.xaml 的交互邏輯
    /// </summary>
    public partial class MainWindow : Window
    {
        private ObservableCollection<Person> personList = new ObservableCollection<Person>();

        public MainWindow()
        {
            InitializeComponent();

            personList.Add(new Person() { Name = "一線碼農", Age = 24 });

            personList.Add(new Person() { Name = "XXX", Age = 21 });

            listview1.ItemsSource = personList;
        }

        private void Button_Click(object sender, RoutedEventArgs e)
        {
            var first = personList.FirstOrDefault();

            first.Name = textBox1.Text;
        }
    }

    public class Person : INotifyPropertyChanged
    {
        public string name;

        public string Name
        {
            get
            {
                return name;
            }
            set
            {
                name = value;
                NotifyPropertyChange("Name");
            }
        }

        public int age;

        public int Age
        {
            get
            {
                return age;
            }
            set
            {
                age = value;
                NotifyPropertyChange("Age");
            }
        }

        public event PropertyChangedEventHandler PropertyChanged;

        private void NotifyPropertyChange(string propertyName)
        {
            if (PropertyChanged != null)
                PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
        }
    }
}

<Window x:Class="ListViewDemo.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">
    <Grid>
        <ListView x:Name="listview1">
            <ListView.View>
                <GridView>
                    <GridViewColumn Header="姓名" DisplayMemberBinding="{Binding Path=Name}"/>
                    <GridViewColumn Header="年齡" DisplayMemberBinding="{Binding Path=Age}"/>
                </GridView>
            </ListView.View>
        </ListView>
        <Button Content="更改名字" Click="Button_Click" Margin="315,174,35,103" />
        <TextBox Height="23" HorizontalAlignment="Left" Margin="162,180,0,0" Name="textBox1" VerticalAlignment="Top" Width="120" />
    </Grid>
</Window>

 

我們只要輸入名字，然后點擊”button按鈕”，最后ListView同步更新了，是不是很神奇的說。

 

五：依賴屬性

    依賴屬性是wpf中獨有的一種屬性，前面文章中或許我們發現WPF的類定義中滿是這些玩意，比如我們看一個TextBlock。

這些Property為后綴的都是叫做依賴屬性，不過依賴屬性這些東西深究起來內容還是比較多的，不過我還是講究應用方面，有時候我們

可能有這樣的需求，就是希望能在TextBlock上顯示當前時間，這時我們就可以擴展TextBlock，在其中增加一個TimeProperty的依賴

屬性來顯示當前時間。

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace WpfApplication12
{
    /// <summary>
    /// MainWindow.xaml 的交互邏輯
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
        }
    }

    public class CustomTextBlock : TextBlock
    {
        //自定義一個依賴項屬性
        public static DependencyProperty TimeProperty = DependencyProperty.Register("Timer", typeof(DateTime),
                                                       typeof(CustomTextBlock),
                                                       new PropertyMetadata(DateTime.Now, OnTimerPropertyChanged),
                                                       ValidateTimeValue);
        /// <summary>
        /// 對依賴屬性進行設置值
        /// </summary>
        public DateTime Time
        {
            get
            {
                //獲取當前屬性值 
                return (DateTime)GetValue(TimeProperty);
            }
            set
            {
                //給當前的屬性賦值
                SetValue(TimeProperty, value);
            }
        }


        static void OnTimerPropertyChanged(DependencyObject obj, DependencyPropertyChangedEventArgs args)
        {

        }

        static bool ValidateTimeValue(object obj)
        {
            DateTime dt = (DateTime)obj;

            if (dt.Year > 1990 && dt.Year < 2200)
                return true;
            return false;
        }

    }
}

<Window x:Class="WpfApplication12.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local="clr-namespace:WpfApplication12"
        Title="MainWindow" Height="350" Width="525">
    <Grid>
        <local:CustomTextBlock Text="{Binding RelativeSource={RelativeSource Self}, Path=Timer}"/>
    </Grid>
</Window>

 

最后感謝一直關注此系列的朋友，希望你們有一絲收獲。