Panuon.WPF.UI 框架使用

Panuon.WPF.UI 使用

安裝與應用

1.通過Nuget 安裝 Panuon.WPF.UI

2.修改 XMAM ,引用命名空間: xmlns:pu="clr-namespace:Panuon.WPF.UI;assembly=Panuon.WPF.UI"

然後把Window 改爲 pu:WindowX

3.在.CS 中引用命名空間:using Panuon.WPF.UI;

同樣，需要把基類Window 改爲 WindowX,這樣窗體基本爲了Panuon 窗體

RingProgressBar 初試

這個控件是一個環形進度條，初看其樣式平淡無奇，自定義控件也可以輕鬆實現，只不過該控件還是封裝了很多樣式，只需要修改幾個屬性便可實現很多效果。

1.Value 值，該進度條的值，中間包含一個TextBlock 用於顯示,IsPercentVisible 用於控制是否顯示該值，通過BorderBrush 控制環形顏色，(起初以爲是個Ellipse Stroke不靈了)，Minimum和Maxinum 控制最小和最大值

2.ShadowHelper 大部分控件這個框架都封裝有對應的幫助類，即控件名+Helper, ShandowHelper.ShaodowDepth 陰影助手陰影深度

3.GeneratingPercentText事件，Value值發生改變時可以通過該事件處理

4.ProgressBar 系列控件助手ProgressBarHelper 常用屬性：IsPercentVisible 是否顯示百分比 IntertedForeground 前景進度條顏色 CornerRadius 圓角

示例：

Code

<pu:WindowX x:Class="Samples.Views.Examples.Window1"
        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:pu="clr-namespace:Panuon.WPF.UI;assembly=Panuon.WPF.UI"
     
        xmlns:local="clr-namespace:Samples.Views.Examples"
        mc:Ignorable="d"
        Title="Window1" Height="450" Width="800"
            WindowStartupLocation="CenterScreen"
              MaskBrush="#AA000000">
    <pu:WindowX.Resources>
        <Style x:Key="RingStandardProgressBarStyle"
               TargetType="pu:RingProgressBar">
            <Setter Property="Minimum"   Value="0" />
            <Setter Property="Maximum" Value="100" />
            <Setter Property="Width" Value="170" />
            <Setter Property="Height" Value="170" />
            <Setter Property="FontSize" Value="20" />
            <Setter Property="BorderThickness" Value="18" />
            <Setter Property="BorderBrush" Value="#22FFFFFF" />
            <Setter Property="BorderBrush" Value="#226CBCEA" />
            <Setter Property="Foreground" Value="#6CBCEA" />
            <Setter Property="IsPercentVisible"   Value="True" />
            <Setter Property="ShadowColor"  Value="#6CBCEA" />
            <Setter Property="pu:ShadowHelper.ShadowDepth" Value="5" />
            <Setter Property="pu:ShadowHelper.BlurRadius" Value="15" />
        </Style>
		</pu:WindowX.Resources>
<Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="220"/>
            <RowDefinition />
            <RowDefinition />
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition />
            <ColumnDefinition />
            <ColumnDefinition />
        </Grid.ColumnDefinitions>
        <pu:RingProgressBar x:Name="rpb" Grid.Row="0" Grid.Column="0" Width="200" Height="200"
                            Style="{StaticResource RingStandardProgressBarStyle}"
                            Margin="0,20,0,0"
                            Value="70"
                            GeneratingPercentText="RingProgressBar_GeneratingPercentText"
                            />
    </Grid>
</pu:WindowX>

效果