I want to change circle thickness inside the solidgauge.is that possible to change this thickness
please help me thanks everyone.
You have to set the Gauge.InnerRadius property:
<Gauge Height="150" Width="150"
From="0" To="1"
Value="0.5"
InnerRadius="60" />
Related
Just a quick question, I've been searching for ages on Google. I have a storyboard:
<Storyboard x:Key="ViewLeftToRight" AccelerationRatio=".5" DecelerationRatio=".5">
<DoubleAnimation Storyboard.TargetName="ReferenceInfo" Storyboard.TargetProperty="Margin" Duration="0:0:0.15" To="{Binding, Width},0,0,0"/>
</Storyboard>
It doesn't work. I was wondering if there is a way for me to bind the Width of the control to the "left" margin. If I need to use a converter, could you possibly show how it would be written in XAML in the above example?
Thanks!
No, you can't bind an animation to Margin, because it does not define a corresponding dependency property. There are several alternatives, here are two:
Place your object in a Canvas and animate Canvas.Left and Canvas.Top
Define a RenderTransform on your object, and animate its X and Y properties.
1)
<Canvas>
<TextBlock Text="test" x:Name="ReferenceInfo" Canvas.Left="0" Canvas.Top="0" />
</Canvas>
Here your storyboard short target the same element ReferenceInfo, but target the attached properties, which you denote using brackets like "(Canvas.Left)":
<DoubleAnimation
Storyboard.TargetName="ReferenceInfo"
Storyboard.TargetProperty="(Canvas.Left)" Duration="0:0:0.15"
To="{Binding Width}"/>
2)
<TextBlock Text="test" x:Name="ReferenceInfo">
<TextBlock.RenderTransform>
<TranslateTransform x:Name="TranslateReferenceInfo" X="0" Y="0" />
</TextBlock.RenderTransform>
</TextBlock>
The animation would then reference the TranslateTransform itself by name:
<DoubleAnimation
Storyboard.TargetName="TranslateReferenceInfo"
Storyboard.TargetProperty="X" Duration="0:0:0.15"
To="{Binding Width}"/>
I have a TextBlock that I would like to give it a color animation effect; I have done something like this:
<Window.Resources>
<Storyboard x:Key="AnimateTarget" RepeatBehavior="Forever">
<ColorAnimation AutoReverse="False" Duration="0:0:5" From="Red" To="black" Storyboard.TargetName="txtBarcode" AccelerationRatio="1" Storyboard.TargetProperty="(TextBlock.Background).(SolidColorBrush.Color)" FillBehavior="HoldEnd">
</ColorAnimation>
</Storyboard>
</Window.Resources>
I start the animation from code behind:
((Storyboard)this.Resources["AnimateTarget"]).Begin();
but when i start the animation its give me the following error:
'Background' property does not point to a DependencyObject in path '(0).(1)'.
I would priciest if someone helps me on this,
Thanks,
Give your TextBlock any Background and it will work.
<TextBlock Name="txtBarcode"
Background="Transparent"
Probably Background is Null and so there is no DependencyObject to animate.
How to specify origin for storyboard based double animation.
Following is the code
<Storyboard x:Key="gridin">
<DoubleAnimation BeginTime="00:00:00" Duration="00:00:05" Storyboard.TargetName="gridA" Storyboard.TargetProperty="Width" From="100" To="300" ></DoubleAnimation>
<DoubleAnimation BeginTime="00:00:00" Duration="00:00:05" Storyboard.TargetName="gridA" Storyboard.TargetProperty="Height" From="100" To="300" ></DoubleAnimation>
</Storyboard>
gridA is a grid on which animation is to be done.
This issue is that gridA animation is started from top middle.
I want to set origin to 0.5, 0.5 but not able to get where to set this value.
One option is to use somehow RenderTransform and set RenderTransformOrigin. I want to avoid this approach.
You could place gridA in another (larger) Grid with HorizontalAlignment and VerticalAlignment set to Center:
<Grid Width="300" Height="300">
<Grid Name="gridA" HorizontalAlignment="Center" VerticalAlignment="Center">
</Grid>
</Grid>
Personally i would prefer to animate a ScaleTransform in RenderTransform.
I need to animate the text color of a custom control between two colors, which are read from two Brush properties of the custom control. My resources look like this:
<SolidColorBrush x:Key="TextBrush">{TemplateBinding Foreground}</SolidColorBrush>
<SolidColorBrush x:Key="AltTextBrush">{TemplateBinding ForegroundAlt}</SolidColorBrush>
Right now, I am trying to animate using a ColorAnimation:
<ColorAnimation Storyboard.TargetName="MyControlText" Storyboard.TargetProperty="Foreground" To="{StaticResource AltTextBrush}" Duration="00:00:00.3000000" />
The ColorAnimation seems to want a Color object, rather than the Brush I am trying to pass. I think I can write an IValueConverter to get the color from the brush, but before I do that, I want to see if there is a simpler way to do the job. Here are my questions:
-- Is there a simple way to animate between two brush resources, or do I need to extract the color for animation?
-- If I need to extract the colors, is an IValueConverter best practice?
-- And finally, amI headed down the right road, or is there a simpler solution to this problem?
Thanks for your help.
Tried with using a Binding and it seems to be working like this
To="{Binding Source={StaticResource TextBrush}, Path=Color}"
Here's a xaml example
<Window.Resources>
<SolidColorBrush x:Key="TextBrush">Black</SolidColorBrush>
<Storyboard x:Key="blinkAnimation" Duration="0:0:5" >
<ColorAnimation Storyboard.TargetProperty="(TextBlock.Foreground).(SolidColorBrush.Color)"
Storyboard.TargetName="TitleTextBlock"
To="{Binding Source={StaticResource TextBrush}, Path=Color}"
AutoReverse="True"
Duration="0:0:2"/>
</Storyboard>
</Window.Resources>
<Grid Background="Black" Name="grid">
<TextBlock x:Name="TitleTextBlock"
Background="Black"
Text="My Text"
FontSize="32"
HorizontalAlignment="Center"
VerticalAlignment="Bottom"
Foreground="White">
<TextBlock.Triggers>
<EventTrigger RoutedEvent="Loaded">
<EventTrigger.Actions>
<BeginStoryboard>
<StaticResource ResourceKey="blinkAnimation"/>
</BeginStoryboard>
</EventTrigger.Actions>
</EventTrigger>
</TextBlock.Triggers>
</TextBlock>
</Grid>
I have a WPF Window that contains a ContentPresenter that has Height and Width set to 0 by default.
When a user clicks a button, I run an animation to transform the ContentPresenter's Height and Width properties to 896,1024 (actually it does 3 rotations whilst its growing, too) and this is all good...
The DataContext for the User control implements IDataErrorInfo and if the user does not click the 'I have read and understand these Health & Safety instructions" checkbox, then a red border is shown around the checkbox...
My problem is that if the user clicks 'Cancel', and I run the animation that shrinks the Height & Width back down to 0,0, then the UserControl shrinks as required, but the red border does not completely disappear - it leaves a single red pixel in the middle of my Window
Anybody any ideas what I'm doing wrong? The 'red-border', I'm assuming is just an Adorner being rendered by WPF for me, so I'm not sure how to change this behaviour...
All help much appreciated!
Update - I tried Abe's excellent suggestion, but unfortunately it didn't work, but it did get me trying other stuff... So now I have (temporarily) commented out the 'shrinking' animations, and simply set the visibility to Collapsed at KeyTime="0:0:0.9"... when I press cancel, just less than a second later, the UserControl disappears but the red adorner stubbornly remains :(
As an extra bit of info (not sure if relevant?) the UserControl being shown in the ContentPresenter also contains a ContentPresenter to render a UserControl, and its the inner content that contains the validation adorner...
code sample:
<Button
Name="signInButton"
Grid.Row="0" Grid.Column="0"
Margin="30"
HorizontalAlignment="Right" VerticalAlignment="Bottom"
Style="{StaticResource LargeButtonStyle}"
Content="Sign In"
Command="{Binding SignInCommand}">
<Button.Triggers>
<EventTrigger
RoutedEvent="Button.Click">
<BeginStoryboard
Storyboard="{DynamicResource openViewAnimation}" />
</EventTrigger>
</Button.Triggers>
</Button>
<ContentPresenter
Name="mainView"
Grid.RowSpan="2" Grid.ColumnSpan="2"
HorizontalAlignment="Center" VerticalAlignment="Center"
Opacity="0.9"
Content="{Binding CurrentContent}">
<ContentPresenter.RenderTransform>
<RotateTransform
Angle="0" />
</ContentPresenter.RenderTransform>
</ContentPresenter>
<Storyboard x:Key="closeViewAnimation">
<DoubleAnimation
Storyboard.TargetName="mainView" Storyboard.TargetProperty="Height"
From="896" To="0" Duration="0:0:0.9"
AutoReverse="False" RepeatBehavior="1x" />
<DoubleAnimation
Storyboard.TargetName="mainView" Storyboard.TargetProperty="Width"
From="1024" To="0" Duration="0:0:0.9"
AutoReverse="False" RepeatBehavior="1x" />
</Storyboard>
Thanks, Ian
If you add an ObjectAnimationUsingKeyFrames that sets the Visibility of the element to Collapsed at the time that the other animations complete, the adorner will go away also.
<Storyboard x:Key="closeViewAnimation">
<DoubleAnimation
Storyboard.TargetName="mainView" Storyboard.TargetProperty="Height"
From="896" To="0" Duration="0:0:0.9"
AutoReverse="False" RepeatBehavior="1x" />
<DoubleAnimation
Storyboard.TargetName="mainView" Storyboard.TargetProperty="Width"
From="1024" To="0" Duration="0:0:0.9"
AutoReverse="False" RepeatBehavior="1x" />
<ObjectAnimationUsingKeyFrames
Storyboard.TargetName="mainView"
Storyboard.TargetProperty="Visibility">
<DiscreteObjectKeyFrame Value="{x:Static Visibility.Collapsed}"
KeyTime="0:0:0.9" />
</ObjectAnimationUsingKeyFrames>
</Storyboard>
Obviously, you would need to do the reverse operation at KeyTime 0 for the openViewAnimation.