Strange behavior on ShowDialog in WPF - wpf

I create separate Window, design it with XAML and when I invoke ShowDialog from main form it seems like my dialog (Window) blinks once and then shows itself. Is it a common behavior? I didn't notice that in while working with Windows Forms. I also ran application on another computer, and get the same thing. It bothers me, cause I was developing a simple game, and it's not the effect I would like users to experience.
It is not a complicated dialog, considering the design. It contains just label and button. Here is one sample:
<Window x:Class="A_Boggle.Info"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Info" Height="300" Width="670" AllowsTransparency="True" WindowStyle="None" Background="Transparent" BorderBrush="Transparent" Foreground="Transparent" ShowInTaskbar="False" ResizeMode="NoResize" WindowStartupLocation="CenterScreen" Closing="Window_Closing">
<Grid>
<Border Background="Transparent" Visibility="{Binding Visibility}">
<Border BorderBrush="#FF7C4400" BorderThickness="4"
CornerRadius="10,0,10,0" VerticalAlignment="Center" HorizontalAlignment="Center" Height="177.5" Width="596.25">
<Border.Background>
<RadialGradientBrush Center="0.5,0.5" GradientOrigin="0.5,0.5" RadiusX="0.479" RadiusY="0.524">
<GradientStop Color="#FFF58611" Offset="0"/>
<GradientStop Color="#FFF58611" Offset="0.11798000335693359"/>
<GradientStop Color="#FFE9B231" Offset="1"/>
</RadialGradientBrush>
</Border.Background>
<Border.BitmapEffect>
<DropShadowBitmapEffect Color="Black" Opacity="0.5" Direction="270" ShadowDepth="0.7" />
</Border.BitmapEffect>
<Grid>
<Separator Height="20" Name="separator1" Margin="8.75,0,6.25,45" VerticalAlignment="Bottom" />
<Button Style="{DynamicResource OrangeButton}" Margin="406.25,0,6.25,6" Height="37.75" VerticalAlignment="Bottom" FontSize="16" Name="dialogButton" Click="dialogButton_Click"></Button>
<Label FontFamily="Resources/#French Grotesque" FontSize="20" Foreground="#FF7C4400" Margin="8.75,20,6.25,71.25" Name="messageLabel"></Label>
</Grid>
</Border>
</Border>
</Grid>

No. Blinking on ShowDialog is not a common behaviour. Could you first try with an empty Window:
new Window().ShowDialog();
in order to see if the problem persists?
Aside from the main topic, WPF/XAML might be not the proper technology for a complicated game due to performance reasons (although for a simple one must be OK).

Related

Create semi-circle blur effect on a Grid

I want to develop a WindowsPhone 8 app with a home page like the fourth phone on this page. The one with a mountain.
You can see an image with two layers over it. My problem is that I don't know how to call that effect in English, and also, I don't know how to do it.
Maybe I will need to make three copies of my image: one untouched, a second one with, a blur effect? and a third one with a 'bigger' blur effect.
Or maybe, I have to add two Grids with some white background and with an opacity less than 100%.
How would you do it?
Your solution is just a good one, I would the samething, and I don't expect that application to be implementing something different, in détails I would do :
One Grid with High Blur on the background.
Another Grid with middle Blur on the front. I'll use an OpacityMask set to a RadialGradientBrush to create that ring effect just like in here : http://msdn.microsoft.com/en-us/library/bb979637(v=vs.95).aspx
And one lase Grid with no Blur in the Front of The previous Grid again with a OpacityMask also set to a RadialGradientBrush.
The three Grids will all have the same Background TileBrush, example :
The Result I've made :
Code :
<StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
<TextBlock Text="The effect you asked, with :" Style="{StaticResource PhoneTextNormalStyle}" Margin="12,0"/>
<TextBlock Text="That's Clapton" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
</StackPanel>
<!--ContentPanel - place additional content here-->
<Grid x:Name="ContentPanel1" Grid.Row="1" Margin="12,0,12,0">
<Grid.Background>
<ImageBrush ImageSource="Eric_Clapton_Blur3.jpg" Stretch="UniformToFill"/>
</Grid.Background>
</Grid>
<Grid x:Name="ContentPanel2" Grid.Row="1" Margin="12,0,12,0">
<Grid.OpacityMask>
<RadialGradientBrush Center="0.5,0.5">
<RadialGradientBrush.RelativeTransform>
<CompositeTransform CenterY="0.5" CenterX="0.5" TranslateX="0.4" ScaleX="1.4"/>
</RadialGradientBrush.RelativeTransform>
<!-- This gradient stop is partially transparent. -->
<GradientStop Color="#00000000" Offset="1" />
<!-- This gradient stop is partially transparent. -->
<GradientStop Color="#20000000" Offset="0.741" />
<!-- This gradient stop is fully opaque. -->
<GradientStop Color="#FF000000" Offset="0.728" />
</RadialGradientBrush>
</Grid.OpacityMask>
<Grid.Background>
<ImageBrush ImageSource="Eric_Clapton_Blur2.jpg" Stretch="UniformToFill"/>
</Grid.Background>
</Grid>
<Grid x:Name="ContentPanel3" Grid.Row="1" Margin="12,0,12,0">
<Grid.OpacityMask>
<RadialGradientBrush Center="0.5,0.5">
<RadialGradientBrush.RelativeTransform>
<CompositeTransform CenterY="0.5" CenterX="0.5" TranslateX="0.4" ScaleY="0.6"/>
</RadialGradientBrush.RelativeTransform>
<!-- This gradient stop is partially transparent. -->
<GradientStop Color="#00000000" Offset="1" />
<!-- This gradient stop is partially transparent. -->
<GradientStop Color="#20000000" Offset="0.741" />
<!-- This gradient stop is fully opaque. -->
<GradientStop Color="#FF000000" Offset="0.728" />
</RadialGradientBrush>
</Grid.OpacityMask>
<Grid.Background>
<ImageBrush ImageSource="Eric_Clapton.jpg" Stretch="UniformToFill"/>
</Grid.Background>
</Grid>
I know I didn't do it with perfection, and I used terrible naming for the Elements, It's just I've just woke up, and didn't even take my breakfast, hope that helps.

Inheriting values declared at UserControl instantiation

First off, I apologize if this question has been asked before. I've done a bit of Google searching but I'm not really sure what the correct keywords are to find what I'm looking for.
Basically my problem is simple to understand. I have a Silverlight project and on the MainPage.xaml I have declared a UserControl and given it a height and a width.
<Grid>
<control:AlarmButton Height="50" Width="50" />
</Grid>
Now within AlarmButton I have a button that has its own Control Template which is set up the way I want. It has a content presenter within it right now.
<UserControl
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"
mc:Ignorable="d"
x:Class="Alarms.AlarmButton">
<UserControl.Resources>
<ControlTemplate x:Key="StatusButton" >
<Viewbox Stretch="Fill">
<Grid>
<Path x:Name="Base" StrokeThickness="1.0" Stroke="#ff000000" StrokeMiterLimit="1.0" Fill="#ff666666" Data="F1 M 99.500,99.500 L 0.500,99.500 L 0.500,0.500 L 99.500,0.500 L 99.500,99.500 Z"/>
<Path x:Name="Interior" Opacity="0.5" StrokeThickness="1.0" Stroke="#ff191919" StrokeMiterLimit="1.0" Data="F1 M 97.500,97.500 L 2.500,97.500 L 2.500,2.500 L 97.500,2.500 L 97.500,97.500 Z">
<Path.Fill>
<LinearGradientBrush MappingMode="Absolute" StartPoint="2.500,2.499" EndPoint="97.500,97.499">
<LinearGradientBrush.GradientStops>
<GradientStop Offset="0.00" Color="#3FFFFFFF"/>
<GradientStop Offset="0.151" Color="Transparent"/>
<GradientStop Offset="1.00" Color="#BFFFFFFF"/>
<GradientStop Color="#53FFFFFF" Offset="0.655"/>
</LinearGradientBrush.GradientStops>
<LinearGradientBrush.Transform>
<MatrixTransform Matrix="1.000,0.000,-0.000,-1.000,0.000,100.000" />
</LinearGradientBrush.Transform>
</LinearGradientBrush>
</Path.Fill>
</Path>
<Path x:Name="LargeShader" Opacity="0.1" Fill="#ffffffff" Data="F1 M 94.667,18.667 L 94.667,94.667 L 6.333,94.667 C 6.333,94.667 94.667,67.348 94.667,18.667 Z"/>
<Path x:Name="SmallShader" Opacity="0.1" Fill="#ffffffff" Data="F1 M 94.667,43.667 L 94.667,94.667 L 20.333,94.667 C 20.333,94.667 94.667,76.334 94.667,43.667 Z"/>
<ContentPresenter x:Name="contentPresenter" Height="{TemplateBinding Height}" Width="{TemplateBinding Width}"
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
Margin="{TemplateBinding Padding}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
</Grid>
</Viewbox>
</ControlTemplate>
</UserControl.Resources>
<Grid >
<Button Template="{StaticResource StatusButton}" >
<TextBlock Text="this is a text box"
TextTrimming="WordEllipsis" />
</Button>
</Grid>
</UserControl>
Later on I'm going to bind the Text property to a DependencyProperty so I can use this button with multiple text. What I want to happen is if the text is too big it will ellipse it and not have the box change or the textblock overflow. I just need to bind the height and width of the TextBlock to some values to contain it.
My question is this; is it possible for the TextBlock to bind its height and width to the values as declared in the MainPage.xaml? Or is this more complicated than I imagine? Is there a better way to go about this?
EDIT
This might give a little more info on what I'm trying to accomplish. This is my "button" with RobSiklos' changes
I think the problem has something to do with the Viewbox, which is telling the TextBlock that it has as much room as it wants.
Probably removing the Viewbox will solve the issue (or at least take the ContentPresenter out of the Viewbox)
I'm not sure I completely understand. Are you trying to make the text ellipse because you don't want the text block to grow if the text is too big? If so, you could use a converter (in the binding statement of the Text property) to have the the converter return the full text value if the text is under a certain length, or have the converter show an ellipse if the text is over that value.
This ought to work:-
<Grid x:Name="LayoutGrid">
<Button Template="{StaticResource StatusButton}" >
<TextBlock Text="this is a text box" TextTrimming="WordEllipsis"
Width="{Binding Parent.Width, ElementName=LayoutRoot}"
Height="{Binding Parent.Height, ElementName=LayoutRoot}" />
</Button>
</Grid>
It assumes that a Width and Height will be specified. An alternative would be to be to use the SizeChanged event of the UserControl to assign values of Width and Height directly.

How to set the back ground color of grid-column in wpf?

I have a wpf mvvm application.
And have a GRID with multiple columns
whats best way to set the back ground color of grid-column in wpf?
dabble125's answer was perfect but to give you a sample and to mention a note that it is important where to place your rectangle see the code:
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<!-- this is not a good place for text block.
the text block is beneath the rectangle
so it would not be seen -->
<!--<TextBlock Grid.Column="1" Text="Some Text"/>-->
<Rectangle Grid.Column="1" Grid.RowSpan="1000">
<Rectangle.Fill>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#FF83FF97" Offset="0" />
<GradientStop Color="White" Offset="1" />
</LinearGradientBrush>
</Rectangle.Fill>
</Rectangle>
<TextBlock Grid.Column="1" Text="Some Text"/>
</Grid>
One way:
Create a rectangle and set its fill to the color of your choice.
Then set its Grid.RowSpan value to a large number or the number of rows you have.
Create a rectangle and set its fill to the color of your choice.
Only having :
<Rectangle
Grid.Column="1"
Fill="#e8ebf1" />
works for me.
The Grid.RowSpan of previous answers is actually useless, and the LinearGradientBrush demonstrated is over-complicated for what is asked.

WPF Templates error - "Provide value on 'System.Windows.Baml2006.TypeConverterMarkupExtension' threw an exception."

I've just started experimenting with WPF templates vs. styles and I'm not sure what I'm doing wrong. The goal below is to alternate the colors of the options in the menu. The code works fine with just the , but when I copy and paste/rename it for the second segment of "MenuChoiceOdd" I get the following error:
> Provide value on 'System.Windows.Baml2006.TypeConverterMarkupExtension' threw an exception.
Sample of the code:
<Window x:Class="WpfApplication1.Template_Testing"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="Template_Testing" Height="300" Width="300">
<Grid>
<Grid.Resources>
<ControlTemplate x:Key="MenuChoiceEven">
<Border BorderThickness="1" BorderBrush="#FF4A5D80">
<TextBlock Height="Auto" HorizontalAlignment="Stretch" Margin="0" Width="Auto" FontSize="14" Foreground="SlateGray" TextAlignment="Left" AllowDrop="True" Text="{Binding Path=Content, RelativeSource={RelativeSource TemplatedParent}}">
<TextBlock.Background>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="White" Offset="0" />
<GradientStop Color="#FFC2CCDB" Offset="1" />
</LinearGradientBrush>
</TextBlock.Background>
</TextBlock>
</Border>
</ControlTemplate>
<ControlTemplate x:Key="MenuChoiceOdd">
<Border BorderThickness="1" BorderBrush="#FF4A5D80">
<TextBlock Height="Auto" HorizontalAlignment="Stretch" Margin="0" Width="Auto" FontSize="14" Foreground="SlateGray" TextAlignment="Left" AllowDrop="True" Text="{Binding Path=Content, RelativeSource={RelativeSource TemplatedParent}}">
<TextBlock.Background>
<LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="White" Offset="0" />
<GradientStop Color="##FFCBCBCB" Offset="1" />
</LinearGradientBrush>
</TextBlock.Background>
</TextBlock>
</Border>
</ControlTemplate>
</Grid.Resources>
<Border BorderBrush="SlateGray" BorderThickness="2" Margin="10" CornerRadius="10" Background="LightSteelBlue" Width="200">
<StackPanel Margin="4">
<TextBlock Height="Auto" HorizontalAlignment="Stretch" Margin="2,2,2,0" Name="MenuHeaderTextBlock" Text="TextBlock" Width="Auto" FontSize="16" Foreground="PaleGoldenrod" TextAlignment="Left" Padding="10" FontWeight="Bold"><TextBlock.Background><LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0"><GradientStop Color="LightSlateGray" Offset="0" /><GradientStop Color="DarkSlateGray" Offset="1" /></LinearGradientBrush></TextBlock.Background></TextBlock>
<StackPanel Height="Auto" HorizontalAlignment="Stretch" Margin="2,0,2,0" Name="MenuChoicesStackPanel" VerticalAlignment="Top" Width="Auto">
<Button Template="{StaticResource MenuChoiceEven}" Content="Test Even menu element" />
<Button Template="{StaticResource MenuChoiceOdd}" Content="Test odd menu element" />
</StackPanel>
</StackPanel>
</Border>
</Grid>
</Window>
What am I doing wrong?
Oy it's Monday...
When I copied pasted the color string from another control it put two "##"s in the prefix here:
<GradientStop Color="##FFCBCBCB" Offset="1" />
Still a lousy error message.
Similarly to others - this horrific error message just meant I had a syntax error in my xaml:
<CheckBox Height="" IsChecked="{Binding IsChecked, Mode=TwoWay}" Width="80">
Notice I hadn't filled in the height value..
I had the same error caused by:
<Border Margin="5" BorderBrush="Black" BorderThickness="" Width="Auto"/>
fixed by putting a number in BorderThickness
In my case, I changed the project name. After I got this error. I re-selected the images and saw that I needed to change the resource name of images too.
<Image x:Name="imgSrc" Grid.Row="1" Source="/PREV%20-%20Filter;component/Images/Subtraktive%20Farbmischung%20%28Malen%20mit%20Wasserfarben%29.jpg" />
/PREV%20-%20Filter;component needs to be corrected to /DSP%20-%20Filter;component in my case.
Assigning Width="*" on Grid gave me the error, which looks weird at the first time, but all it is trying to say is that the markup couldn't be converted to actual type.
Unlike others, I had my XAML syntax correct.
<ImageBrush ImageSource="..\Images\previous_icon.png" />
This error started appearing when i changed my image - later realised i did change the image in my folder but forgot to Include it in my project .
Hence although XAML could show me the image in 'Desgn' View - I faced this exception # run time.
Silly one.
I had the same error when using Grey instead of Gray in my BorderBrush
<Setter Property="BorderBrush" Value="Grey"/>
instead of
<Setter Property="BorderBrush" Value="Gray"/>
Here is another instance of this error and how I resolved it.
This appears to have been caused by upgrading my project from VS2010 to VS2012 and VS2013. Not sure exactly why that would be an issue here, but I guess it is.
I developed a Visual Studio Wizard to automate the process of adding a project to our very large solution (300+ projects) as there are additional requirements for us developers to help maintain the project. I used WPF for the wizard and that worked well for VS2010. I upgraded the project to VS2012 and VS2013 and I started getting this error. Turns out that at some point the path to my icon and image files was screwed up. Once I corrected it - which I did directly within the XAML - I stopped getting the error.
In case you may need help referencing resources - this is the post I used to correct my issues: How to reference an icon resource file reference in XAML
I had the same when I forgot curly brackets:
<DataTrigger Binding="{Binding Path=IsWhiteboardShared}" Value="True">
<Setter Property="Background" Value="StaticResource AccentColorBlueBrush"/>
</DataTrigger>
I was tasked to fix a bug where a similar error message was being shown ad infinitum. When I found out that the following caused the issue, I was a little disappointed (Was expecting something more complex and catastrophic!):
<Style BasedOn="{StaticResource LinkButton}" TargetType="Button" >
where LinkButton should have been LinkButtonStyle.
I had the same error, but was using the wrong path for an image in the resources folder
I had this...
<controls:ImageButton Grid.Column="2" ImageButtonSource="Resources/close_normal.png"/>
but i needed this...
<controls:ImageButton Grid.Column="2" ImageButtonSource="../Resources/close_normal.png"/>
Had to add ../ at the start to go back one folder first
I had the same error when using 'OutBox' for this code:
<DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<materialDesign:PackIcon Kind="OutBox" Width="25" Height="25" VerticalAlignment="Center" Margin="5" Foreground="DodgerBlue"/>
</DataTemplate>
</DataGridTemplateColumn.CellTemplate>
OutBox was Unknow Value so changed to 'StopCircle' then fixed...
This exact context of the exception seems to vary as others answers point out but generally it occurs when value in beetwen "" in XAML has some incorrect data in it.
I encounteted the error in the same circumstances as James and it helped me to look at what's inside of InnerException which contained the actual exception cause.

How to position UserControl in the parent canvas

I want to place this UserControl at Canvas.Left="168", Canvas.Top="213".
However, the control appears at a corner. What should I do?
If I put the values at the point of usage for this class, the values are returned as NaN
In that case how can I get the correct Left and Top Values?
Usage:
<Canvas x:Name="DesignerCanvas"
ClipToBounds="True"
SnapsToDevicePixels="True">
<Gr:BareNode />
</Canvas>
UserControl:
<UserControl x:Class="DiagramDesigner.BareNode"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Grid>
<ContentControl Width="50"
Height="50"
Padding="2"
Canvas.Left="168" Canvas.Top="213">
<Ellipse IsHitTestVisible="False" >
<Shape.Fill>
<RadialGradientBrush Center="0.2, 0.2" GradientOrigin="0.2, 0.2" RadiusX="0.8" RadiusY="0.8">
<GradientStop Color="LightBlue" Offset="0"/>
<GradientStop Color="Blue" Offset="0.9"/>
</RadialGradientBrush>
</Shape.Fill>
</Ellipse>
</ContentControl>
</Grid>
</UserControl>
I'm not sure if you tried this or not, but just from looking at the XAML it appears that you are trying to set the position of the user control inside the user control. That won't work. You need to put it where you use the user control
<Canvas x:Name="DesignerCanvas"
ClipToBounds="True"
SnapsToDevicePixels="True">
<Gr:BareNode Canvas.Left="168" Canvas.Top="213"/>
</Canvas>
Take the Canvas.Left="168" Canvas.Top="213" part out of the ContentControl declaration of inside the user control.

Resources