Windows phone layer - wpf

How can I create the effect similar to Windows Phone's MessageBox, where the message gets displayed on a new layer with transparent background, so that the windows becomes modal? My layout is created out of Grid, so I do not know how to add any content over it. Please help.

It's easy to overlay one set of content with another in WPF. Try changing the visibility of the border below, for a simple message box effect. You would of course bind Visibility to your view model, or set it in code behind.
<Grid>
<Grid>
<!-- All your layout here -->
</Grid>
<Border Height="100" Width="100" Background="Azure" Visibility="Hidden">
<TextBlock Text="Hi there" HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Border>
</Grid>

Related

Wpf, AvalonEdit and keyboard navigation problem

I have an AvalonEdit on my window. When I press key combination Ctrl+Up or Ctrl+Down when inside editor, AvalonEdit loses focus, which is transferred to a different control, as below:
This sometimes happen as well when using Ctrl+Left or Ctrl+Right combinations.
My current XAML definition looks like following:
<ae:TextEditor x:Name="teEditor"
Grid.Row="0"
Grid.Column="0"
VerticalAlignment="Stretch"
HorizontalAlignment="Stretch"
BorderThickness="0"
FontFamily="Consolas"
FontSize="10pt"
TabIndex="0"
WordWrap="{Binding ElementName=Root, Path=Handler.WordWrap}"
ShowLineNumbers="{Binding ElementName=Root, Path=Handler.LineNumbers}"
ContextMenu="{StaticResource EditorContextMenu}"
GotFocus="HandleEditorGotFocus"
KeyboardNavigation.ControlTabNavigation="None"
KeyboardNavigation.AcceptsReturn="True"
KeyboardNavigation.DirectionalNavigation="None"
KeyboardNavigation.TabNavigation="None"/>
How can I prevent that?
It turns out, that problem appears, when you place AvalonEdit inside TabControl. In such case you have to disable keyboard navigation on the TabControl by adding:
KeyboardNavigation.TabNavigation="Local" KeyboardNavigation.DirectionalNavigation="Contained"

Popup AllowTransparency is killing WebBrowser child

So I have a control in my application that I wanted to utilize the popup for. It is has a WebBrowser control that is a part of it.
I notice that whenever I set the following property only the WebBrowser control disappears on my custom control.
.AllowsTransparency = true;
However, if I remove the property the control looks normal and functions normal. The only reason I am setting that property is because it the control utilizes rounded borders and by default the Popup control has a black background.
This same behavior exists in a Window if you set the AllowsTransparency property to true.
Just to note you can simulate this behavior on a brand new control with no special properties. I have tested both on a new control and a new window.
Any help is appreciated.
Edit
This occurs when the WebBrowser is set to DesignMode = On.
The WebBrowser is not a native WPF control. It is actually just internally creating an ActiveX WebBrowser control. HwndHost's (like WebBrowser) cannot be placed into a Window/Popup whose AllowsTransparency is true because that enables layered windows (i.e. includes the WS_EX_LAYERED style).
I am not sure what you're doing there. Without code, it's hard to tell. But my guess, is that you are not setting the background of the inner border control. Just put this code in a new solution and there shouldn't be any problems, everything is visible:
<StackPanel >
<Popup IsOpen="True" AllowsTransparency="True">
<Border Padding="10" Width="250" Height="250" Opacity="1" BorderBrush="Black" BorderThickness="1" CornerRadius="3">
<Border Background="Black">
<StackPanel>
<TextBlock Foreground="White" Margin="5,25,5,5" HorizontalAlignment="Center">tata</TextBlock>
<Button Background="Black" Foreground="White" BorderBrush="Silver" HorizontalAlignment="Center">ok</Button>
</StackPanel>
</Border>
</Border>
</Popup>
......

Creating Popup programmatically in WP7

How to create the popup in program? e.g. I need to rename the file in phone App. How to do this by using popup in wp7?
Add a Popup element to your XAML and define the content using regular elements (as you would any other Page or UserControl. Set the Popup.IsOpen property to true to show the Popup and false to close the Popup. The following XAML shows an example that I use for showing in-application "toast" notifications with the Silverlight Windows Phone Toolkit
<Popup x:Name="_toast">
<Grid x:Name="_toastContainer"
VerticalAlignment="Bottom"
Width="{Binding ActualWidth, ElementName=LayoutRoot}">
<StackPanel Margin="14,10">
<TextBlock Text="{Binding Title}"
HorizontalAlignment="Stretch"
TextWrapping="Wrap" />
<TextBlock Text="{Binding Content}"
HorizontalAlignment="Stretch"
TextWrapping="Wrap" />
</StackPanel>
</Grid>
</Popup>
Take a look at the Input Prompt control in the Coding4Fun Windows Phone Toolkit

WPF Dockpanel first child uses remaining space

In a window I have there is a list of DockPanels to specify a couple of files. Each DockPanel has a TextBox (for the path) and a button (to browse for a file).
I've recreated a simple WPF page to demostrate the problem here:
<Page
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Width="150"
Height="22">
<DockPanel>
<TextBox HorizontalAlignment="Stretch"/> <!-- path to file -->
<Button Content="..." DockPanel.Dock="Right"/> <!-- button to browse for file -->
</DockPanel>
</Page>
The problem is that I want the button to the right of the textbox, but that causes the textbox to be really small since the LastChild of the DockPanel is the button it uses up the remaining space. Ive tried to change this by shuffling them around and setting LastChildFill="False" but that only causes the button to be small again, not making the TextBox wide (even with HorizontalAlignment="Stretch").
The reason I want the controls in that order is I want the user to reach the TextBox before the Button when using tab to navigate in the window. I looked into setting TabIndex but it feels hacky, favorite features of WPF is that tabindex are in the order the conrols are defined in the XAML. Not to mention that I probably would have to manually set TabIndex on everything in the Window.
To me, it seems that the setting of TextBox.HorizontalAlignment isn't respected. How can I make the first control use as much space as it can but still preserve tab order?
Make it like this:
<DockPanel LastChildFill="True">
<Button Content="..." DockPanel.Dock="Right"/> <!-- button to browse for file -->
<TextBox DockPanel.Dock="Left" HorizontalAlignment="Stretch"/> <!-- path to file -->
</DockPanel>
If you don't want the behavior of DockPanel, don't use a DockPanel.
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<TextBox />
<Button Content="..." Grid.Column="1"/>
</Grid>

WPF: Visual studio like error buttons

I want to get this.
buttons http://www.shrani.si/f/X/6Y/24Jhn9D3/buttns.png
Everything works so far, buttons act as filter and are bind to the grid control.
All i want is the icons and counter on the button.
Whats the correct way of implementing those?
<ToggleButton x:Name="IsErrorShown" Margin="4" Width="100" Content="{lex:LocText Errors, Assembly=Client}">
I have tried adding image like this:
<ToggleButton x:Name="IsErrorShown" Margin="4" Width="100" Content="{lex:LocText Errors, Assembly=Client}">
<StackPanel>
<Image Source="Resources/Warning"/>
</StackPanel>
</ToggleButton>
but i get error that prop. Content is defined more then once.
A WPF Button (or ToggleButton) is a content control, into which you can put anything.
I haven't checked, but these buttons probably have a horizontal stack panel or a DockPanel, with an Image and then one or two TextBlocks. You could make a template for these, and also use binding to set the TextBlock Text content from your viewmodel.
Snoop ( http://snoopwpf.codeplex.com/ ) is a great tool for finding out how other people have built things in WPF.
The Adam Nathan WPF book is excellent, and if you don't have it you should get it. http://www.amazon.co.uk/Windows-Presentation-Foundation-Unleashed-WPF/dp/0672328917
Here's an example:
<ToggleButton Height="24" Width="100">
<DockPanel>
<Image Source="c:\\temp\\me.jpg" Margin="3"/>
<TextBlock Text="20 Errors"/>
</DockPanel>
</ToggleButton>

Resources