我有下面的繪圖影像,它是一個圓弧,現在我想在一個回圈中無限期地應用從 0 到 360 的旋轉來模擬一個微調影片。你可以
<DrawingImage x:Key="ico_spinnerDrawingImage">
<DrawingImage.Drawing>
<DrawingGroup ClipGeometry="M0,0 V12 H12 V0 H0 Z">
<DrawingGroup.Transform>
<TranslateTransform X="9.5367397534573684E-07" Y="1.1465158453161615E-14" />
</DrawingGroup.Transform>
<GeometryDrawing Brush="#FF00AA2B" Geometry="F1 M12,12z M0,0z M12,12C12,10.4241 11.6896,8.86371 11.0866,7.4078 10.4835,5.95189 9.59958,4.62902 8.48528,3.51472 7.37098,2.40042 6.04811,1.5165 4.5922,0.913445 3.13629,0.310389 1.57586,-6.88831E-08 -9.53674E-07,0L0,3C1.1819,3 2.35222,3.23279 3.44415,3.68508 4.53608,4.13738 5.52823,4.80031 6.36396,5.63604 7.19969,6.47177 7.86262,7.46392 8.31492,8.55585 8.76721,9.64778 9,10.8181 9,12L12,12z" />
</DrawingGroup>
</DrawingImage.Drawing>
</DrawingImage>
上面的 drawingimage 包含在我匯入到我的 WPF 視圖的字典中,我通過這樣做將它關聯到 WPF 影像的源屬性(我洗掉了不相關的屬性):
<Image Source="{Binding Path=MySpinnerIcon}"/>
現在,如何將該影片應用于繪圖影像以模擬影片微調器永遠連續旋轉?
uj5u.com熱心網友回復:
例子:
<StackPanel>
<FrameworkElement.Resources>
<Pen x:Key="сircle" Brush="LightGray" Thickness="5"/>
<Pen x:Key="arc" Brush="LightGreen" Thickness="5" EndLineCap="Round" StartLineCap="Round"/>
<DrawingImage x:Key="ico_spinnerDrawingImage">
<DrawingImage.Drawing>
<DrawingGroup>
<DrawingGroup.Transform>
<RotateTransform Angle="0"/>
</DrawingGroup.Transform>
<GeometryDrawing Pen="{StaticResource сircle}">
<GeometryDrawing.Geometry>
<EllipseGeometry Center="0,0" RadiusX="10" RadiusY="10"/>
</GeometryDrawing.Geometry>
</GeometryDrawing>
<GeometryDrawing Geometry="M10,0 A10,10 90 0 1 0,10"
Pen="{StaticResource arc}"/>
</DrawingGroup>
</DrawingImage.Drawing>
</DrawingImage>
</FrameworkElement.Resources>
<Image Source="{DynamicResource ico_spinnerDrawingImage}" Width="100">
<Image.Triggers>
<EventTrigger RoutedEvent="Loaded">
<BeginStoryboard>
<Storyboard>
<DoubleAnimation From="0" To="360" Duration="0:0:1"
Storyboard.TargetProperty="Source.Drawing.Transform.Angle"
RepeatBehavior="Forever"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Image.Triggers>
</Image>
</StackPanel>
PS有了這樣的筆,在我看來,影片會更好看:
<Pen x:Key="arc" Thickness="5" EndLineCap="Round" StartLineCap="Round">
<Pen.Brush>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="Transparent"/>
<GradientStop Color="LawnGreen" Offset="1"/>
</LinearGradientBrush>
</Pen.Brush>
</Pen>
uj5u.com熱心網友回復:
您可以為用作UI 元素的 的Angle
屬性設定影片。RotateTransform
RenderTransform
影片本身由 aDoubleAnimation
中的 a執行StoryBoard
,例如可以由UI 元素的EventTrigger
on事件啟動。Loaded
下面的示例使用一個簡單的Path
元素而不是影像。它在一個 200x200 的盒子中繪制了一個 20 個單位寬、兩端為圓、半徑為 90 的橢圓弧。
<Path Data="M100,10 A90,90 0 0 1 190,100"
Width="200" Height="200"
Stroke="Turquoise" StrokeThickness="20"
StrokeStartLineCap="Round" StrokeEndLineCap="Round"
RenderTransformOrigin="0.5,0.5">
<Path.RenderTransform>
<RotateTransform />
</Path.RenderTransform>
<Path.Triggers>
<EventTrigger RoutedEvent="Loaded">
<BeginStoryboard>
<Storyboard TargetProperty="RenderTransform.Angle">
<DoubleAnimation By="360" Duration="0:0:1"
RepeatBehavior="Forever"/>
</Storyboard>
</BeginStoryboard>
</EventTrigger>
</Path.Triggers>
</Path>
uj5u.com熱心網友回復:
您可以嘗試使用后臺作業者。
在你的 xaml 中:
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<ed:Arc Grid.Column="0" x:Name="Arc1" ArcThickness="5" Height="32" Width="32" StartAngle="0" EndAngle="360" Stretch="None" Fill="Gray"/>
<ed:Arc Grid.Column="0" x:Name="Arc2" ArcThickness="5" Height="32" Width="32" StartAngle="0" EndAngle="45" Stretch="None" Fill="DeepSkyBlue"/>
</Grid>
顏色和尺寸可以根據您的喜好更改。
將Microsoft.Expression.Drawing DLL 添加到您的專案中。
在你的 xaml.cs 中:
添加
using System.Drawing;
using System.Threading;
using System.Threading.Tasks;
宣告一個全域變數bool runProcess = true;
然后添加將觸發微調器開始移動的事件
private void EventName (object sender, RoutedEventArgs e)
{
runProcess = true;
BackgroundWorker worker = new BackgroundWorker();
worker.RunWorkerCompleted = Worker_RunWorkerCompleted;
worker.WorkerReportsProgress = true;
worker.DoWork = Worker_DoWork;
worker.ProgressChanged = Worker_ProgressChanged;
worker.RunWorkerAsync();
//Function you want to call while the spinner rotates
}
添加以下兩個函式使微調器移動
private void Worker_DoWork (object sender, DoWorkEventArgs e)
{
BackgroundWorker worker = sender as BackgroundWorker;
while ( runProcess )
{
Thread.Sleep(50); //Any value <60 will give you a smooth movement
worker.ReportProgress(0 /*Dummy value*/);
}
}
private void Worker_ProgressChanged (object sender, ProgressChangedEventArgs e)
{
Arc2.StartAngle = 10; //Any value can be chosen for this
Arc2.EndAngle = 10; //Just keep the same value for both
}
添加此功能以在微調器停止后執行任何需要執行的操作
private void Worker_RunWorkerCompleted (object sender, RunWorkerCompletedEventArgs e)
{
//Whatever you want to do after the spinner stops
}
然后添加要在微調器移動時運行的函式。
ReturnType FunctionName(InputParameters)
{
//Whatever your function is supposed to do
runProcess = false;
}
轉載請註明出處,本文鏈接:https://www.uj5u.com/qianduan/537157.html
標籤:C#wpfvisual-studio-2019.net-4.5