Develop Reference

WPF Extended Toolkit BusyIndicator Text is cutoff

When I use the WPF Extended Toolkit BusyIndicator in any other application, I have no problems. Using it in my current application, the text is cut off. I have been playing around with the properties on the BusyIndicator. Here is the xaml:
<xctk:BusyIndicator IsBusy="True" Panel.ZIndex="1000"/>
I wanted to post a picture so you could see what it looks like. The "Please Wait..." text is too low and the bar is laying on top of it. Has anyone experienced this before? I am stumped on what to do. I can't figure out how to change the height of the content inside the box, if that is even the issue.
Edit:
It currently displays as the following:
But I want it to display without the text being covered:
The designer displays it how I want it to display but the application, while running, displays it as shown in image one.

I think that your problem is that you have changed the default textblock size. But you can also fix with the BusyContentTemplate
For example I make the text bigger and red:
<xctk:BusyIndicator IsBusy="True" Panel.ZIndex="1000" >
<xctk:BusyIndicator.BusyContentTemplate>
<DataTemplate>
<TextBlock Foreground="Red" FontSize="15">Please Wait</TextBlock>
</DataTemplate>
</xctk:BusyIndicator.BusyContentTemplate>
</xctk:BusyIndicator>
You can also change the textblock for whatever you want.
I hope this can help you.

I discovered the issue. The underlying datatypes in the WPF Extended Toolkit's BusyIndicator is a grid. One of the grid's properties were being set in a global style file that I was unaware of...

Disable StackPanel Highlighting in XAML

I have found very little information about this matter. Know that I am a newbie to C# and WPF:
I have a stack panel defined in a XAML file as such :
<StackPanel Orientation="Vertical" >
<TextBlock Text="Locale: " VerticalAlignment="Center"/>
<ComboBox x:Name="comboLocale" Width="60" VerticalAlignment="Center" SelectionChanged="comboLocale_SelectionChanged"/>
</StackPanel>
I want to disable the highlighting that happens when I MouseOver the stack panel, which creates a blue color inside the StackPanel for some reason. I don't have any special style set up yet. Some threads talked about setting OverridesDefaultStyle to TRUE, but this didn't seem to change anything. Also, StackPanel do not have a ControlTemplate available, so most of the solutions I found couldn't be applied since they refer to a Button or TextBlock.
Any input on the matter would be greatly appreciated!
-Regards

StackPanels in general have no visual representation and are just layout containers which control placement of other elements. Given that you haven't set anything like Background on your StackPanel, it isn't what's causing the highlight you're seeing unless some other part of your XAML or code is modifying it. The behavior you describe sounds like the default behavior of a Button but without seeing more of your code it's hard to tell where the behavior is coming from.

Since you mentioned in a comment you've found out you're actually looking at the expected behavior of a Menu as your culprit. You'll just need to edit the MenuItem Control Template, more specifically the IsHighlighted that's causing your highlight. You'd likely find something like this helpful.
Or there's lots more various information found with a quick search for customizing a WPF Menu / MenuItem, hope this helps.

Add a Behavior to an Image

In my program I have an System.Controls.Image to which I want
to add a shaking Behavior from here Animate Image in button to shake
I copied the ShakingBehavior to my project to it's own class,
and I already have the Blend SDK.
Now I added the XAML Part to my Image
<Image Source="myImage.png" Grid.Row="{Binding Path=Row}" Grid.Column="{Binding Path=Col}" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="0">
<i:Interaction.Behaviors>
<local:ShakeBehavior RepeatInterval="5" SpeedRatio="3.0"/>
</i:Interaction.Behaviors>
</Image>
Now I get an error that I cannot get rid of!
(As I do not have an english VS here, I try to translate the message)
The Interaction type has no attachable Behaviors property
probably just a namespace to add (the i alias), but I cannot bring it to work
edit
More information: The Image is contained in a button, which is inside a datatemplate.
And (at best) I want to start the animation when another button in the view is clicked.
(this Behavior shall help to find the button as a hint)

Since Mohib doesn't want to, i will post the correct line that I have missed:
this one should be without those magic unprinted values that can be found in Mohibs answer.
xmlns:i="clr-namespace:System.Windows.Interactivity;assembly=System.Windows.Interactivity"

Windows phone 7.1 ListPicker, easy way to go full mode?

I'm trying to use the ListPicker controller with ListPickerMode="Full", to get the fullscreen pick window. However it just generate an error when i try
"A first chance exception of type 'System.Windows.Markup.XamlParseException' occurred in System.Windows.dll
Additional information: Set property Microsoft.Phone.Controls.ListPicker.ListPickerMode threw an exception. [Line: 49 Position: 57]"
Here's my code:
<toolkit:ListPicker x:Name="OutputSelector" ListPickerMode="Full"
Margin="0,542,6,0" Header="Output Type" Width="450" VerticalAlignment="Top" />
I populate my ListPicker in C# using a list to set as ItemSource if that is any help.
Another thing is that when i try to write "ListPickerMode" in xml it doest give it as an option, but when i have written the whole thing it suggest "Full" "expanded" and "Normal".
If i add 5 items to the ListPicker it automatically uses FullMode, and i have tried changing ItemCountThreshold="0" but that just generate more errors.
I'm using Windowns Phone 7.1 OS 2011 aug release.
It's probably just me that is stupid, first day with Windows Phone programing :)
UPDATE!
Well it looks like ItemCountThreshold & ListPickerMode was remove for 7.1 or something, atleast in XAML part, not the C# part, where they are read only.
Solution for my problem!
<toolkit:ListPicker x:Name="OutputSelector" ExpansionMode="FullScreenOnly"
Margin="0,542,6,0" Header="Output Type" Width="450" VerticalAlignment="Top" />
The ExpansionMode will make the Listpicker appear in fullscreen or expanded.

As stated in the issue tracker of the silverlight toolkit [1], ItemCountThreshold should not be set (and cannot be set using simple xaml).
However, there are two workarounds for this issue. If you you don't mind to use codebehind, set the property via SetValue:
//e.g., in the constructor, just after InitializeComponent();
ListPicker.SetValue(Microsoft.Phone.Controls.ListPicker.ItemCountThresholdProperty, 0);
To set the value in xaml, you can use a binding:
<toolkit:ListPicker ItemCountThreshold="{Binding Hugo,FallbackValue=0}">(...)
In this example, I use a bogus binding expression and set the value using FallbackValue. Of course, an actual working binding should work as well. The xaml approach was only tested on the WP8 SDK, however it should work on 7.1 as well.
Edit: Just found out that the xaml approach breaks the designer.
[1] http://silverlight.codeplex.com/workitem/9742

The solution proposed by the author (moving here for better visibility):
Well it looks like ItemCountThreshold & ListPickerMode was remove for
7.1 or something, atleast in XAML part, not the C# part, where they are read only.
Solution for my problem!
<toolkit:ListPicker x:Name="OutputSelector" ExpansionMode="FullScreenOnly"
Margin="0,542,6,0" Header="Output Type" Width="450" VerticalAlignment="Top" />
The ExpansionMode will make the Listpicker appear in fullscreen or
expanded.

How can I pop a control out of it's container to make it full screen when clicked in Silverlight/Wp7?

So I have a Panorama control and the PanoramaItems are programmatically added to the control using the following template.
<UserControl>
<Grid x:Name="LayoutRoot">
<controls:PanoramaItem Name="sitePanoramaItem" Header="{Binding Name}">
<Controls:DockPanel VerticalAlignment="Stretch">
<StackPanel Orientation="Horizontal" Margin="0,10,0,0" Controls:DockPanel.Dock="Top">
<Image Source="../Images/action.png" Width="64" />
<TextBlock Text="{Binding Stats, Mode=TwoWay}" FontSize="45" Margin="15,0,0,0" />
</StackPanel>
<Grid x:Name="graphCanvas" HorizontalAlignment="Stretch" Margin="10,10,10,10"> </Grid>
</Controls:DockPanel>
</controls:PanoramaItem>
</Grid>
</UserControl>
When I click on graphCanvas what I'd like to do is sorta pop the graphCanvas out and display that fullscreen then when I click again restore it to where it was. I've been all over this site and Google and can't find anything similar to what I'm looking for.
I would still like to maintain the Panorama control functionality so that the graphCanvas is still the only one visible but you can cycle through them. Currently I have it sorta working in that I remove the Grid from the DockPanel and put it directly in the LayoutRoot while making the sitePanoramaItem collapsed. However, it's not fullscreen as the Panorama name is still visible (I guess I could hide that as well...) When I put the graphCanvas back int he DockPanel the size of the canvas is all screwed up.
I was hoping there was a simpler way.
Is it even possible?

It is possible to create the UI you describe but it's not going to be simple. You're on the right track with removing it in code and adding it the LayoutRoot and making the Panorama hidden. However you would have to code the scrolling behavior yourself and that is going to be quite tricky - especially making it feel the way to panorama does.
One trick you could try is actually layer a PivotControl on top of your Panorama and have it be collapsed by default. Also edit it's template to remove all default content eg: remove the header control, set margins to 0, etc). Then when you want to go full screen you can remove all the graphCanvases from the Panorama items and and add them to new PivotItems in the PivotControl. Then hide the Panorama and show the Pivot. This will give you scrolling capability for free and the illusion of full screen.
Having said all that I'm not sure I would recommend this. The more common approach would be to simply be to navigate to another page when the user selects an item and handle the full screen aspects there (possibly using the Pivot control again for scrolling). And when you want to leave "fullscreen" mode simply navigate back to the first page. Handling Tombstoning of the fullscreen state will be much easier with this approach for one thing.

You can try making the graphCanvas a Page and putting it in a different XAML. Then add a frame (name it InnerFrame for example) in the same place where you have the graphCanvas right now and navigate to that page with InnerFrame. When the frame is clicked, you navigate with the RootFrame of the app to your graphCanvas page. When you decide to close it, just navigate back with the RootFrame.
Hope it's clear enough :)
Edit:
Navigation in WP7 works very similar as the standard navigation in Silverlight 4, but it's a bit more restrictive. Just throw a PhoneApplicationFrame in your XAML like this:
<phone:PhoneApplicationFrame x:Name="Frame" />
This is basically the same as a Silverlight frame. All the pages you create inherit from PhoneApplicationPage by default, so they can be showed in a frame without any changes.
Your whole application actually runs on a PhoneApplicationFrame. If you take a look at your App class you will see this:
public PhoneApplicationFrame RootFrame { get; private set; }
Here's the MSDN documentation for the navigation system on WP7