閱讀導航:
一、先看效果二、本文背景在YouTube上看到的一個視頻,文末有鏈接,使用前端時間介紹的開源C# WPF 控件庫HandyControl,用到了其中的頭像控件、水波紋控件、拖動條控件等。 三、代碼實現(xiàn)站長使用.Net Core 3.1創(chuàng)建的WPF工程,創(chuàng)建名稱為“CustomControlsHandyOrg”的解決方案后,需要添加Nuget庫:HandyControl。 代碼不多,首先在App.xaml中添加HandyControl兩個樣式文件: 1 <Application x:Class="CustomControlsHandyOrg.App" 2 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 3 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 4 xmlns:local="clr-namespace:CustomControlsHandyOrg" 5 StartupUri="MainWindow.xaml"> 6 <Application.Resources> 7 <ResourceDictionary> 8 <ResourceDictionary.MergedDictionaries> 9 <ResourceDictionary Source="pack://application:,,,/HandyControl;component/Themes/SkinDefault.xaml"/>10 <ResourceDictionary Source="pack://application:,,,/HandyControl;component/Themes/Theme.xaml"/>11 </ResourceDictionary.MergedDictionaries>12 </ResourceDictionary>13 </Application.Resources>14 </Application> 另外一個代碼文件是MainWindow.xaml,首先引入HandyControl命名空間 1 xmlns:hc="https://handyorg./handycontrol" 代碼確實不多,關鍵代碼也就10行左右 1 <Window x:Class="CustomControlsHandyOrg.MainWindow" 2 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 3 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 4 xmlns:d="http://schemas.microsoft.com//blend/2008" 5 xmlns:mc="http://schemas./markup-compatibility/2006" 6 xmlns:local="clr-namespace:CustomControlsHandyOrg" 7 mc:Ignorable="d" 8 xmlns:hc="https://handyorg./handycontrol" 9 Height="450" Width="300" ResizeMode="NoResize" WindowStartupLocation="CenterScreen" WindowStyle="None">10 <Grid Background="#FF222222">11 <StackPanel VerticalAlignment="Center">12 <hc:Gravatar Id="{Binding Value,ElementName=slider}"/>13 <TextBlock FontSize="18" Text="DOWNLOADING" Margin="5 15" Foreground="White" HorizontalAlignment="Center"/>14 <hc:WaveProgressBar Value="{Binding Value,ElementName=slider}" Maximum="100" Background="#FF555555" WaveFill="#ff563380" WaveStroke="#FF5675" WaveThickness="1" Foreground="White"/>15 <Button Content="STOP" Margin="15" HorizontalAlignment="Stretch" Background="#FF563380" BorderBrush="#FF482480" Foreground="White"/>16 <hc:PreviewSlider x:Name="slider" Maximum="100" Margin="20"/>17 </StackPanel>18 </Grid>19 </Window> 四、文章參考上面的代碼是Dotnet9看 Disign com WPF 大神視頻手敲的,下面是大神youtube地址及本實例學習視頻。 參考: 五、代碼下載文章中代碼已經全部貼出,就這么幾行代碼,不要奇怪,就是這么多。
|
|