首頁(yè) 猿問如何在 wpf...

如何在 wpf 中制作自定義形狀的進(jìn)度條？

C#

qq_笑_17 2022-01-09 16:45:49

好的，我將自定義一個(gè)進(jìn)度條或在 C# WPF 中加載，而不是矩形，它最后應(yīng)該有一些小的清晰度。看起來像這樣加載完成后銳度消失目前，這就是我所做的。我怎樣才能實(shí)現(xiàn)自定義加載欄？這是我的代碼，XAML<Window x:Class="loadingbarSolution.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:Themes="clr-namespace:Microsoft.Windows.Themes;assembly=PresentationFramework.Aero" Title="MainWindow" Height="350" Width="525"> <Window.Resources> <Style x:Key="{x:Type ProgressBar}" TargetType="{x:Type ProgressBar}"> <Setter Property="Template"> <Setter.Value> <ControlTemplate TargetType="ProgressBar"> <Border BorderBrush="#D9DCE1" BorderThickness="0" Background="#FF0C0B0B" CornerRadius="0" Padding="0"> <Grid x:Name="PART_Track"> <Rectangle x:Name="PART_Indicator" HorizontalAlignment="Left" Fill="#FF2BA9FF" /> </Grid> </Border> </ControlTemplate> </Setter.Value> </Setter> </Style> </Window.Resources> <Grid> <ProgressBar x:Name="IMSIProgressBar" HorizontalAlignment="Left" Height="20" Margin="82,136,0,0" VerticalAlignment="Top" Width="200" BorderThickness="1" Background="#FF0C0B0B"/> </Grid></Window>我該怎么辦？

查看完整描述

3 回答

慕的地10843

TA貢獻(xiàn)1785條經(jīng)驗(yàn) 獲得超8個(gè)贊

返回代碼：

class MyCustomConverter : IValueConverter

{

public object Convert(object value, Type targetType, object parameter, CultureInfo culture)

{

return new Thickness(0, 0, -(double)value, 0);

}

public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)

{

throw new NotImplementedException();

}

模板：

<ControlTemplate.Resources>

<local:MyCustomConverter x:Key="sttc"/>

</ControlTemplate.Resources>

<Rectangle.RenderTransform>

</TransformGroup>

</Rectangle.RenderTransform>

</Rectangle>

</Grid>

</Border>

</ControlTemplate>

注意：如果高度是固定的，則不需要轉(zhuǎn)換器，將邊距設(shè)置為固定的厚度。轉(zhuǎn)換器僅適用于自動(dòng)調(diào)整大小。

反對(duì) 回復(fù) 2022-01-09

千萬里不及你

TA貢獻(xiàn)1784條經(jīng)驗(yàn) 獲得超9個(gè)贊

您可以Polygon在模板中使用 a ：

<Setter.Value>

</Grid>

</Border>

</ControlTemplate>

</Setter.Value>

</Setter>

您必須隨時(shí)隱藏它Value == Maximum，例如使用轉(zhuǎn)換器。

反對(duì) 回復(fù) 2022-01-09

慕絲7291255

TA貢獻(xiàn)1859條經(jīng)驗(yàn) 獲得超6個(gè)贊

第三種方法是使用Path它Data被設(shè)計(jì)為逆時(shí)針傾斜變換并且它RenderTransform是順時(shí)針的SkewTransform。這樣，移動(dòng)指示器確實(shí)完全達(dá)到了 100%。

<Path.RenderTransform>

</Path.RenderTransform>

</Path>

<Path.RenderTransform>

</Path.RenderTransform>

</Path>

</Grid>

</Viewbox>

</ControlTemplate>

2018年的兩種方法和這個(gè)方法的比較：

以上 APNG 的完整代碼：

MainWindow.xaml：

<Window x:Class="StackOverFlowTest.MainWindow"

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:local="clr-namespace:StackOverFlowTest"

mc:Ignorable="d"

Title="MainWindow" Height="250" Width="550">

<Window.Resources>

<!--

ProgressBar templates with skewed Indicator:

Reference: "How do I make a custom shape of progressbar in wpf?"

https://stackoverflow.com/questions/52250531/how-do-i-make-a-custom-shape-of-progressbar-in-wpf

-->

<!--

ProgressBar with skewed Rectangle

Advantages: - Moving Indicator supports transparent background

- Moving Indicator shows no artifacts

Disadvantage: - Moving Indicator doesn't completely reach 100%

Code from "Mr. Squirrel.Downy": https://stackoverflow.com/a/52252590

-->

<Rectangle.RenderTransform>

</TransformGroup>

</Rectangle.RenderTransform>

</Rectangle>

</Grid>

</Border>

</ControlTemplate>

<!--

ProgressBar with right-aligned Polygon

Disadvantages: - Moving Indicator doesn't completely reach 100%

- Moving Indicator doesn't support transparent background (Polygon must hide Indicator)

- Moving Indicator shows artifacts when ProgressBar is set to large width (Polygon isn't able to hide Indicator accurately)

- <ControlTemplate> has to be adjusted if height of ProgressBar exceeds height of Polygon

Code from "mm8": https://stackoverflow.com/a/52279788

-->

</Grid>

</Border>

</ControlTemplate>

<!--

ProgressBar with skewed Path

Advantages: - Moving Indicator completely reaches 100%

- Moving Indicator supports transparent background

- Moving Indicator shows no artifacts

Disadvantage: - <ControlTemplate> has to be adjusted

if proportion (width-height-ratio) of ProgressBar differs from

the two ones in PathGeometry, otherwise the moving Indicator alters its angle.

How2: Create PathGeometry ( <Path Data="..."> ) contrary to planed skew angle to skew PART_Indicator to desired angle.

Example: By default "PART_Indicator" is always vertical. To solely give the Indicator a 45° clockwise 'rotation' ("/"),

design your Path as a 45° anti-clockwise skewed Path.

For a simple Path like in these ProgressBars, you can quite easily do mental arithmetic.

For more complex Path Data, you can use calculation methods in CS code...

-->

<Path.RenderTransform>

</Path.RenderTransform>

</Path>

<Path.RenderTransform>

</Path.RenderTransform>

</Path>

</Grid>

</Viewbox>

</ControlTemplate>

</Window.Resources>

<Label Content="<Rectangle> + <SkewTansform> (by Mr. Squirrel Downy)" HorizontalAlignment="Left" VerticalAlignment="Center" Foreground="#FFFFFF" />

</Grid>

<Label Content="<Polygon HorizontalAlignment="Right" /> (by mm8)" HorizontalAlignment="Left" VerticalAlignment="Center" Foreground="#FFFFFF" />

</Grid>

<Label Content="<Path> + <SkewTransform>" HorizontalAlignment="Left" VerticalAlignment="Center" Foreground="#FFFFFF" />

</Grid>

</StackPanel>

</Window>

為了完整起見，在后面的代碼中計(jì)算復(fù)雜路徑數(shù)據(jù)的示例（上述 XAML 不需要）：

MainWindow.xaml.cs：

using System.Diagnostics;

using System.Globalization;

using System.Windows;

using System.Windows.Media;

namespace StackOverFlowTest

{

/// <summary>

/// Interaction logic for MainWindow.xaml

/// </summary>

public partial class MainWindow : Window

{

public MainWindow()

{

InitializeComponent();

// Instantiate and initialize variable for normal Path Data without transformation:

Geometry geo = Geometry.Parse("M 0,0 l 150,0 0,10 -150,0 z");

// Instantiate and initialize variable for desired shearing/transvection

// (use opposite transformation to the one in the ControlTemplate):

SkewTransform skewT = new SkewTransform(45, 0);

// In case of additional transformations:

// Instantiate and initialize variable for desired translation:

//TranslateTransform transT = new TranslateTransform(-31.89, 0);

// Instantiate variable for all transformations, as you have to apply all transformation at once:

//TransformGroup tG = new TransformGroup();

//tG.Children.Add(skewT);

//tG.Children.Add(transT);

// Create a clone of of your Geometry object,

// since in order to apply a transform, geometry must not be readonly:

Geometry geoClone = geo.Clone();

// Apply transformation:

geoClone.Transform = skewT;

// For multiple transformations:

//geoClone.Transform = tG;

// Calculate new Path Data:

string result = geoClone.GetFlattenedPathGeometry(0.001, ToleranceType.Relative).ToString(CultureInfo.InvariantCulture);

//var result = geoClone.GetFlattenedPathGeometry(0.001, ToleranceType.Relative).ToString().Replace(",", ".").Replace(";", ",");

// Return new Path Data:

Trace.WriteLine(this + ": " + result);

// Returns: M0,0L150,0 160,10 10,10 0,0z

// Note that returned values are absolute values.

// Identical Path Data in relative coordinates (meaning offset values to respective previous point):

// M 0,0 l 150,0 10,10 -150,0 z

}

反對(duì) 回復(fù) 2022-01-09

3 回答
0 關(guān)注
327 瀏覽

關(guān)注

添加回答

舉報(bào)

0/150

提交

取消

使用 Ctrl+D 可將網(wǎng)站添加到書簽

微信客服

購(gòu)課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動(dòng)學(xué)習(xí)伙伴

公眾號(hào)

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號(hào)

第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

熱搜

最近搜索清空

如何在 wpf 中制作自定義形狀的進(jìn)度條？

如何在 wpf 中制作自定義形狀的進(jìn)度條？

3 回答

添加回答

如何在 wpf 中制作自定義形狀的進(jìn)度條？

如何在 wpf 中制作自定義形狀的進(jìn)度條？