背水一战 Windows 10 (75) - 控件（控件基类）: FrameworkElement - 基础知识, 相关事件, HorizontalAlignment, VerticalAlignment

作者：webabcd

介绍
背水一战 Windows 10 之控件（控件基类 - FrameworkElement）

基础知识
相关事件
HorizontalAlignment 和 VerticalAlignment

示例
1、演示 FrameworkElement 的基础知识
Controls/BaseControl/FrameworkElementDemo/Demo1.xaml

<Page
    x:Class="Windows10.Controls.BaseControl.FrameworkElementDemo.Demo1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Windows10.Controls.BaseControl.FrameworkElementDemo"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="Orange">
        <StackPanel Name="stackPanel" Background="Blue" Margin="100">

            <TextBlock Name="lblMsg" Margin="5" />

        </StackPanel>
    </Grid>
</Page>

Controls/BaseControl/FrameworkElementDemo/Demo1.xaml.cs

/*
 * FrameworkElement - FrameworkElement（继承自 UIElement, 请参见 /Controls/BaseControl/UIElementDemo/）
 *     MinWidth, MinHeight - 最小宽高，默认值为 0
 *     MaxWidth, MaxHeight - 最大宽高，默认值为 double.PositiveInfinity
 *     Width, Height - 宽高，默认值为 NaN
 *     ActualWidth, ActualHeight - 实际宽高，来自 UIElement 的 RenderSize 属性（uwp 的 layout 是一个递归系统，更多说明请参见 /MyControls/MyControl2.cs）
 *     Margin - Margin
 *         它是一个 Thickness 类型的对象，在 C# 端就构造这个对象即可
 *         在 xaml 端设置的话，其规则为“左,上,右,下”或“左右,上下”或“左上右下”，可以用逗号分隔也可以用空格分隔
 *     Name - 名字
 *     FindName() - 查找当前页面的指定名字的对象
 *     Parent - 获取当前对象的父对象
 *     Tag - 用于保存任意对象
 *     Language - 设置或获取当前元素及其所有子元素的语言信息（没什么实际效果，就是一个标记而已）
 *     BaseUri - 获取当前对象所在的 xaml 页面的 uri 地址
 *     DataContext - 数据上下文（参见 /Bind/DataContextChanged.xaml）
 *     RequestedTheme - 主题（参见 /Resource/ThemeResourceDemo.xaml.cs）
 *     Resources - 资源字典（参见 /Resource/ResourceDictionaryDemo.xaml）
 *     Style - 样式（参见 /Controls/UI/Style.xaml）
 *     GetBindingExpression() - 获取指定属性的绑定信息（参见 /Bind/UpdateSourceTrigger.xaml.cs）
 *     SetBinding() - 设置绑定信息（参见 /Bind/BindingElement.xaml.cs）
 *         
 *     
 * 本例用于演示 FrameworkElement 的基础知识
 */

using System;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;

namespace Windows10.Controls.BaseControl.FrameworkElementDemo
{
    public sealed partial class Demo1 : Page
    {
        public Demo1()
        {
            this.InitializeComponent();

            this.Loaded += Demo1_Loaded;
        }

        private void Demo1_Loaded(object sender, RoutedEventArgs e)
        {
            stackPanel.MinWidth = 0;
            stackPanel.MinHeight = 0;
            stackPanel.MaxWidth = double.PositiveInfinity;
            stackPanel.MaxHeight = double.PositiveInfinity;

            lblMsg.Text += $"stackPanel.ActualWidth:{stackPanel.ActualWidth}, stackPanel.ActualHeight:{stackPanel.ActualHeight}";
            lblMsg.Text += Environment.NewLine;

            if (this.FindName("lblMsg") as TextBlock == lblMsg)
            {
                lblMsg.Text += "this.FindName(\"lblMsg\") as TextBlock == lblMsg";
                lblMsg.Text += Environment.NewLine;
            }

            if (lblMsg.Parent as StackPanel == stackPanel)
            {
                lblMsg.Text += "lblMsg.Parent as StackPanel == stackPanel";
                lblMsg.Text += Environment.NewLine;
            }

            lblMsg.Text += "BaseUri:" + this.BaseUri;
            lblMsg.Text += Environment.NewLine;

            lblMsg.Tag = "i am webabcd";
            lblMsg.Text += "lblMsg.Tag:" + lblMsg.Tag;
            lblMsg.Text += Environment.NewLine;
        }
    }
}

2、演示 FrameworkElement 的相关事件
Controls/BaseControl/FrameworkElementDemo/Demo2.xaml

<Page
    x:Class="Windows10.Controls.BaseControl.FrameworkElementDemo.Demo2"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Windows10.Controls.BaseControl.FrameworkElementDemo"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="Orange">
        <StackPanel Name="stackPanel" Background="Blue" Margin="100">

            <TextBlock Name="lblMsg" Margin="5" />

        </StackPanel>
    </Grid>
</Page>

Controls/BaseControl/FrameworkElementDemo/Demo2.xaml.cs

/*
 * FrameworkElement - FrameworkElement（继承自 UIElement, 请参见 /Controls/BaseControl/UIElementDemo/）
 *     DataContextChanged - 数据上下文发生改变后触发的事件（参见 /Bind/DataContextChanged.xaml）
 *     Loading - 在 OnNavigatedTo 之后，由外到内触发 Loading 事件
 *     Loaded - 由内到外触发 Loaded 事件
 *     Unloaded - 在 OnNavigatedFrom 之后，由外到内触发 Unloaded 事件
 *     SizeChanged - 在尺寸（ActualWidth 或 ActualHeight）发生变化时触发的事件，位置等发生变化时不会触发
 *     LayoutUpdated - 布局更新时触发的事件，比如尺寸发生了变化或位置发生了变化等
 *     
 *     
 * 本例用于演示 FrameworkElement 的相关事件
 */

using System;
using System.Diagnostics;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Navigation;

namespace Windows10.Controls.BaseControl.FrameworkElementDemo
{
    public sealed partial class Demo2 : Page
    {
        public Demo2()
        {
            this.InitializeComponent();

            this.Loading += page_Loading;
            this.Loaded += page_Loaded;
            this.Unloaded += page_Unloaded;

            stackPanel.Loading += stackPanel_Loading;
            stackPanel.Loaded += stackPanel_Loaded;
            stackPanel.Unloaded += stackPanel_Unloaded;

            lblMsg.Loading += lblMsg_Loading;
            lblMsg.Loaded += lblMsg_Loaded;
            lblMsg.Unloaded += lblMsg_Unloaded;

            lblMsg.SizeChanged += lblMsg_SizeChanged;
            lblMsg.LayoutUpdated += lblMsg_LayoutUpdated;
        }



        protected override void OnNavigatedTo(NavigationEventArgs e)
        {
            lblMsg.Text += "OnNavigatedTo";
            lblMsg.Text += Environment.NewLine;
        }
        protected override void OnNavigatingFrom(NavigatingCancelEventArgs e)
        {
            Debug.WriteLine("OnNavigatingFrom");
        }
        protected override void OnNavigatedFrom(NavigationEventArgs e)
        {
            Debug.WriteLine("OnNavigatedFrom");
        }



        private void page_Loading(FrameworkElement sender, object args)
        {
            lblMsg.Text += "page_Loading";
            lblMsg.Text += Environment.NewLine;
        }
        private void page_Loaded(object sender, RoutedEventArgs e)
        {
            lblMsg.Text += "page_Loaded";
            lblMsg.Text += Environment.NewLine;
        }
        private void page_Unloaded(object sender, RoutedEventArgs e)
        {
            Debug.WriteLine("page_Unloaded");
        }



        private void stackPanel_Loading(FrameworkElement sender, object args)
        {
            lblMsg.Text += "stackPanel_Loading";
            lblMsg.Text += Environment.NewLine;
        }
        private void stackPanel_Loaded(object sender, RoutedEventArgs e)
        {
            lblMsg.Text += "stackPanel_Loaded";
            lblMsg.Text += Environment.NewLine;
        }
        private void stackPanel_Unloaded(object sender, RoutedEventArgs e)
        {
            Debug.WriteLine("stackPanel_Unloaded");
        }



        private void lblMsg_Loading(FrameworkElement sender, object args)
        {
            lblMsg.Text += "lblMsg_Loading";
            lblMsg.Text += Environment.NewLine;
        }
        private void lblMsg_Loaded(object sender, RoutedEventArgs e)
        {
            lblMsg.Text += "lblMsg_Loaded";
            lblMsg.Text += Environment.NewLine;
        }
        private void lblMsg_Unloaded(object sender, RoutedEventArgs e)
        {
            Debug.WriteLine("lblMsg_Unloaded");
        }



        private void lblMsg_SizeChanged(object sender, SizeChangedEventArgs e)
        {
            Debug.WriteLine($"lblMsg_SizeChanged, PreviousSize:{e.PreviousSize}, NewSize:{e.NewSize}");

            // 注：如果在这里又改变了 lblMsg 的尺寸的话，则会发生循环调用，编译时会出现“Layout cycle detected.  Layout could not complete.”错误
        }
        private void lblMsg_LayoutUpdated(object sender, object e)
        {
            Debug.WriteLine("lblMsg_LayoutUpdated");

            // 注：如果在这里又改变了 lblMsg 的布局的话，则会发生循环调用，编译时会出现“Layout cycle detected.  Layout could not complete.”错误
        }
    }
}

3、演示 FrameworkElement 的 HorizontalAlignment 和 VerticalAlignment 的应用
Controls/BaseControl/FrameworkElementDemo/Demo3.xaml

<Page
    x:Class="Windows10.Controls.BaseControl.FrameworkElementDemo.Demo3"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:Windows10.Controls.BaseControl.FrameworkElementDemo"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="Orange">
        <StackPanel Name="stackPanel" Background="Blue" Margin="100" VerticalAlignment="Stretch">
            
            <ComboBox Name="cmbHorizontalAlignment" PlaceholderText="HorizontalAlignment" SelectionChanged="cmbHorizontalAlignment_SelectionChanged" Margin="5">
                <ComboBoxItem>Left</ComboBoxItem>
                <ComboBoxItem>Center</ComboBoxItem>
                <ComboBoxItem>Right</ComboBoxItem>
                <ComboBoxItem IsSelected="True">Stretch</ComboBoxItem>
            </ComboBox>

            <ComboBox Name="cmbVerticalAlignment" PlaceholderText="VerticalAlignment" SelectionChanged="cmbVerticalAlignment_SelectionChanged" Margin="5">
                <ComboBoxItem>Top</ComboBoxItem>
                <ComboBoxItem>Center</ComboBoxItem>
                <ComboBoxItem>Bottom</ComboBoxItem>
                <ComboBoxItem IsSelected="True">Stretch</ComboBoxItem>
            </ComboBox>
            
        </StackPanel>
    </Grid>
</Page>

Controls/BaseControl/FrameworkElementDemo/Demo3.xaml.cs

/*
 * FrameworkElement - FrameworkElement（继承自 UIElement, 请参见 /Controls/BaseControl/UIElementDemo/）
 *     HorizontalAlignment - 水平对齐方式（Left, Center, Right, Stretch）
 *     VerticalAlignment - 垂直对齐方式（Top, Center, Bottom, Stretch）
 *     
 *     
 * 本例用于演示 FrameworkElement 的 HorizontalAlignment 和 VerticalAlignment 的应用
 */

using System;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;

namespace Windows10.Controls.BaseControl.FrameworkElementDemo
{
    public sealed partial class Demo3 : Page
    {
        public Demo3()
        {
            this.InitializeComponent();
        }
        
        private void cmbHorizontalAlignment_SelectionChanged(object sender, SelectionChangedEventArgs e)
        {
            stackPanel.HorizontalAlignment = (HorizontalAlignment)Enum.Parse(typeof(HorizontalAlignment), (e.AddedItems[0] as ComboBoxItem).Content.ToString());
        }

        private void cmbVerticalAlignment_SelectionChanged(object sender, SelectionChangedEventArgs e)
        {
            stackPanel.VerticalAlignment = (VerticalAlignment)Enum.Parse(typeof(VerticalAlignment), (e.AddedItems[0] as ComboBoxItem).Content.ToString());
        }

    }
}

OK
[源码下载]

posted @ 2017-11-24 16:13 webabcd 阅读(2240) 评论(0) 编辑收藏举报

刷新页面返回顶部

背水一战 Windows 10 (75) - 控件（控件基类）: FrameworkElement - 基础知识, 相关事件, HorizontalAlignment, VerticalAlignment

公告