Develop Reference

WPF window border acting weird with Ribbon Control

I am using the Ribbon control in WPF and I noticed there are 2 different versions.
using Microsoft.Windows.Controls.Ribbon;
If I use this one in my xaml and class, my whole window will be in a very old windows style.
using System.Windows.Controls.Ribbon;
If I use this one in my xaml and class, my Ribbontabs suddenly won't fill correctly anymore.
When I use both of them. With this:
<ribbon:RibbonWindow x:Class="WPSDashboard.Views.ShellWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:ribbon="clr-namespace:System.Windows.Controls.Ribbon;assembly=System.Windows.Controls.Ribbon"
xmlns:r="clr-namespace:Microsoft.Windows.Controls.Ribbon;assembly=RibbonControlsLibrary"
xmlns:prism="clr-namespace:Microsoft.Practices.Prism.Regions;assembly=Microsoft.Practices.Prism"
Title="WPSDashboard"
x:Name="RibbonWindow"
Width="640" Height="480">
<Grid x:Name="LayoutRoot">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<!-- Ribbon Region -->
<r:Ribbon x:Name="Ribbon" prism:RegionManager.RegionName="RibbonRegion">
<r:Ribbon.ApplicationMenu>
<r:RibbonApplicationMenu SmallImageSource="Images\SmallIcon.png">
<r:RibbonApplicationMenuItem Header="Exit"
x:Name="MenuItemExit"
ImageSource="Images\Exit.png"
Command="{Binding ExitCommand}"/>
</r:RibbonApplicationMenu>
</r:Ribbon.ApplicationMenu>
</r:Ribbon>
<Grid x:Name="ClientArea" Grid.Row="1">
<!-- Workspace Region-->
<GridSplitter HorizontalAlignment="Left" Width="2" Grid.Column="1"/>
<ContentControl x:Name="WorkspaceRegion" Grid.Column="1" prism:RegionManager.RegionName="WorkspaceRegion" />
</Grid>
</Grid>
</ribbon:RibbonWindow>
My Ribbontabs will load but the window now looks like this:
I can't click on close and minimize and maximize. <---
How can I get the border to be normal instead of small?
I can't close my windows this way.

I found the best way to make it look and work good!
Instead of the tags <ribbon:RibbonWindow on the beginning of the xaml,
Make it <Window .
Also add this part:
xmlns:r="clr-namespace:System.Windows.Controls.Ribbon;assembly=System.Windows.Controls.Ribbon"
Then in your class delete your : RibbonWindow (If it's there)
If that doesn't work and you don't need the quick access toolbar, this may help:
Go back to your XAML, and change the Ribbon margin to -22 :
<r:Ribbon x:Name="Ribbon" prism:RegionManager.RegionName="RibbonRegion" Margin="0,-22,0,0" >
Now my application looks like this(with the -22 margin) :
Now it looks like a normal application without an ugly windows 98 or 2000 style and the close button, minizime button and maximize button are back!

I personally would, either play on margins, or better than that, investigate the style of that ribbon and change it the way it helps my needs

What is the equivalent way to use Bitmap,Graphics,PictureBox & BitmapCopy() in WPF?

I'll try to explain my problem clearly.
I have a working code in WinForms that has a Board (PictureBox) that shows an image thats generated from a list of users controls (win-forms) by the function UserControl.BitmapCopy() for each user control.
This process begins with a blank image (Graphic type), and for each user control I draw it in a specific location with the function BitmapCopy() of the user control.
The result is an image that looks like a real form (with buttons,labels,etc.), but it’s just an image.
Then I show this image in a picture Box.
Now I need to implement this code in WPF, but I can’t generate an image of each user control with BitmapCopy().
I found this code that does it, so now I can generate a bitmap for each user control, but I don’t know what is the best way to create the Big Board that eventually shows a bitmap that has all the user controls images inside it, in different locations.
I would appreciate any help.

This is the equivalent in WPF:
<Window x:Class="MiscSamples.VisualBrush"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="VisualBrush" Height="300" Width="300" x:Name="Window">
<StackPanel>
<TextBlock Text="Hi, Im a Window!"/>
<TextBox Text="This is a TextBox"/>
<Slider Width="200"/>
</StackPanel>
<Window.ToolTip>
<ToolTip DataContext="{Binding PlacementTarget, RelativeSource={RelativeSource Self}}">
<Grid Height="400" Width="400">
<Grid.Background>
<VisualBrush Visual="{Binding}"/>
</Grid.Background>
</Grid>
</ToolTip>
</Window.ToolTip>
</Window>
The Window's ToolTip consists of a grid painted with VisualBrush whose Visual is the Window itself. It looks like this:
As you can see, Exactly 0 lines of C# code are required to achieve the same in WPF.

problems by scrolling a ListBox with finger touch in windows 8 app

I developed a windows 8 app in which I present a newsarea in a ListBox control. For the news items I use a template. A news item has different sizes. The size of the item will be set after the LayoutUpdate-event. If I scroll the list by finger Tuuch, there are flicker effects. These occur because the amount of items I subsequently adapting. When I use a constant size, I have no problems with flicker effects. When I scroll the list whith the mouse there are no problemns. Is there a posibilitie to prefer this flicker effects? Do everyone had similar problems and have a solotion for me?
My template:
<UserControl
x:Class="components.NewsItemRenderer"
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"
d:DesignHeight="150"
d:DesignWidth="560" >
<Canvas x:Name="rootCanvas"
Width="560"
Height="150">
<TextBlock x:Name="lbl_title"
Width="480"
Canvas.Left="15"
Canvas.Top="35"
MaxHeight="50"
SizeChanged="lbl_description_SizeChanged"
LayoutUpdated="lbl_title_LayoutUpdated"
Style="{StaticResource LabelTitle}"
Text="{Binding Path=message.title}"/>
<TextBlock x:Name="lbl_description"
Canvas.Left="15"
Canvas.Top="55"
Width="480"
SizeChanged="lbl_description_SizeChanged"
Style="{StaticResource LabelDescription}"
Text="{Binding Path=message.description}"/>
</Canvas>
</UserControl>
private void lbl_description_SizeChanged(object sender, SizeChangedEventArgs e)
{
lbl_description.SetValue(Canvas.TopProperty, lbl_title.ActualHeight + 45);
double _height = lbl_subject.ActualHeight + lbl_title.ActualHeight + lbl_description.ActualHeight + 40;
this.Height = _height;
rootCanvas.Height = _height;
}
My control:
<ListBox x:Name="viewBox"
Visibility="Visible"
Background="{x:Null}"
Foreground="{x:Null}"
Width="580"
Height="580"
BorderThickness="0"
ItemsSource="{Binding Source={StaticResource newsMessages}}"
ItemTemplate="{StaticResource newsTemplate}"
ScrollViewer.HorizontalScrollBarVisibility="Disabled"
ItemContainerStyle="{StaticResource NoSelectListBoxItemStyle}" />

Yes.
The easiest way to do this is to use the IncrementalUpdateBehavior in your XAML.
Ref: http://marcominerva.wordpress.com/2014/01/15/using-incrementalupdatebehavior-to-incrementally-show-data-in-listviewbase-controls/
Ref: http://blogs.msdn.com/b/hanxia/archive/2013/11/04/incremental-update-item-data-for-listviewbased-controls-in-windows-8-1.aspx
This basically allows you to identify parts inside your DataTemplate that should show up first while scrolling. Cutting up your UI like this lets XAML paint much faster and reduce flicker.
Having said that, I want to also say this. Sometimes because of the quantity of data we are showing, we need to make compromises on the complexity of our data templates. That might be your case.
Best of luck!

How to change maximize button color/texture

Is there any way to change the Minimize button, Maximize button, WPF window frame/border ect. using styles in the xaml?

These buttons are part of the Window Chrome, and therefore are supposed to be left for the user to decide on how they look (Windows has options for changing the color of the chrome). So if you want to take control of the Chrome, it is not as simple as a window style.
You can use the WindowStyle property to get rid of them, or make the window a Dialog-type window, but for more control, you'll need to get into creating custom chrome for your window.
If you want to go down this path, it is definitely possible, but you'll need to look at information about creating a custom chrome for your window. Here are a couple resources, but do your research and see which of these, or what other resources best meet your needs:
Code Project Library
Stack Overflow Answer w/ Links
MSDN Blog

You can remove the default Windows chrome with WindowStyle="None" and ResizeMode="NoResize" and then create whatever borders/buttons you like. E.g.
<Window x:Class="WpfApplication1.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
WindowStyle="None"
ResizeMode="NoResize"
BorderBrush="Blue"
BorderThickness="5">
<StackPanel Orientation="Horizontal"
VerticalAlignment="Top"
HorizontalAlignment="Right"
Height="20" >
<Button Content="Minimize" />
<Button Content="Restore" />
<Button Content="Close" />
</StackPanel>
</Window>

Window opened with showDialog, TextBlock is showing underneath window instead of text

I have this wierd wpf problem.
I have a window (full screennm) with an Image, looks like this:
I open a new window with Showdialog uppon this window, which is not full screen (looks like a popup, but its a window). the code is like this:
Window next; next = new PasswordVerification();
next.Owner = this;
next.ShowDialog();
on the open window I use this to center the "popup":
this.Left = this.Owner.Left + (this.Owner.Width - this.ActualWidth) / 2;
this.Top = this.Owner.Top + (this.Owner.Height - this.ActualHeight) / 2;
this.Topmost = true;
I get something like this ( i cropped it, the window is slight bigger):
Where the textblock is defined like this:
<Rectangle Name="errorBorder" Fill="#34FF0000" FlowDirection="RightToLeft" RadiusX="13" RadiusY="13" Stroke="#FFB80005" Visibility="Visible" Margin="43,195,78,203" />
<TextBlock Name="error" Text="TextBlock" Margin="49,195,91,205" FontSize="20" FlowDirection="RightToLeft" FontWeight="Bold" Foreground="#FFB80000" Visibility="Visible" />
Now I have a button, that does this:
error.Text = "blabla";
But instead of what I expected (that the Text will change) I get this wierd stuff:
As you can see, The image from the rear window is sligtly shown, instead of my textBlock!
What is going on here??Please Help!
The PopUp XAML:
<Window ... Width="1000" Height="700" AllowsTransparency="True"
WindowStyle="None"
Background="#00000000"/>
<Border Style="{StaticResource SmallScreenBorderStyle}" CornerRadius="23" Padding="2" Margin="153.66,117.992,153.661,117.992" d:LayoutOverrides="Width, Height">
<!-- Use a VisualBrush of 'mask' as the opacity mask -->
<Grid.OpacityMask>
<VisualBrush Visual="{Binding ElementName=mask}"/>
</Grid.OpacityMask>
<!-- Rounded mask (stretches to fill Grid) to make grid rounded corners -->
<Border x:Name="mask" CornerRadius="20" Margin="2,5,-1,-5" d:LayoutOverrides="GridBox" Style="{StaticResource MaskBorderStyle}"/>

Few suggestions:
1) Remove your code to open window at center of owner, just use this in your Window XAML:
<Window ....
WindowStartupLocation="CenterOwner">
2) Shorten your calling method:
Window next = new PasswordVerification {Owner = this};
next.ShowDialog();
3) Put your Rectangle and TextBlock in <StackPanel> or another container. Probably the problem that these controls overlaps because lives inside Grid.

Could you try setting the Visible property to false on your your main form, and then setting it back to true after your ShowDialog?