'Controls' is an undeclared prefix; XML is not valid - wpf

So here's my xaml:
<Window x:Class="KinectButton.Window1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:Controls="clr-namespace:Coding4Fun.Kinect.Wpf.Controls;assembly=Coding4Fun.Kinect.Wpf"
Title="Weather" Height="1024" Width="1280" WindowStartupLocation="CenterScreen">
<Grid x:Name="LayoutRoot">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="812*" />
<ColumnDefinition Width="446*" />
</Grid.ColumnDefinitions>
<Canvas Background="#FF371780" Grid.ColumnSpan="2">
<Controls:HoverButton Margin="0" Padding="0" x:Name="kinectButton" ImageSize="50"
ImageSource="/Images/RightHand.png"
ActiveImageSource="/Images/RightHand.png"
TimeInterval="2000" Panel.ZIndex="1000" Canvas.Left="0" Canvas.Top="0" />
<Button x:Name="button1" Content="Close" Height="141" Canvas.Left="979" Canvas.Top="6" Width="273" Background="#FFFFF600" FontSize="53.333" Click="button1_Click" BorderThickness="4" Foreground="#FF1A1717" />
<Label Canvas.Left="0" Canvas.Top="733" Content="" Height="1024" Name="message" Width="1280" Foreground="White" FontSize="40" HorizontalContentAlignment="Center" VerticalContentAlignment="Center" />
<Image Height="128" Name="videoStream" Stretch="Fill" Width="191" Canvas.Left="539" Canvas.Top="825" />
</Canvas>
</Grid>
</Window>
And it keeps giving the error:
''Controls' is an undeclared prefix. Line 11, position 14.' XML is not valid.

Build -> Clean Solution
Build -> Rebuild Solution
Just tested your XAML - everything is valid and should not cause any problems.

Related

WPF main left height 100%, main right height 100% and footer

I have created the following design with main left, main right and footer.
However I want main left to be height 100%, so that the dark gray background color goes all the way down to the footer.
I've tried to set height=*, but it doesnt help.
My design:
NewProjectWindow.xaml
<Window x:Class="QuickImageForensicsWPF.NewProject.NewProjectWindow"
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"
xmlns:local="clr-namespace:QuickImageForensicsWPF.NewProject"
mc:Ignorable="d"
Title="New Project | Quick Image Forensics" Height="{DynamicResource {x:Static SystemParameters.MaximizedPrimaryScreenHeightKey}}" Width="{DynamicResource {x:Static SystemParameters.MaximizedPrimaryScreenWidthKey}}" Top="0" Left="0">
<Window.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="..\res\style\Btn.xaml" />
<ResourceDictionary Source="..\res\style\Input.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Window.Resources>
<Grid Background="#FF45474A">
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<!-- Main -->
<StackPanel x:Name="stackPanelMain" Grid.Row="0" Grid.Column="0" >
<Grid Background="#FF45474A">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="400" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<StackPanel x:Name="stackPanelLeft" Grid.Row="0" Grid.Column="0" Background="#FF393939" Margin="0,0,20,0">
<!-- Left content -->
<Label x:Name="labelProjects" Content="New project" Margin="0,20,0,0" FontSize="16" Foreground="#FFBABAA8" FontWeight="Bold"/>
<Label x:Name="labelNewProjectStep01" Content="Project information" Margin="0,0,0,0" FontSize="14" Foreground="#FFBABAA8" FontStyle="Italic" />
<Label x:Name="labelNewProjectStep02" Content="Automated tasks" Margin="0,0,0,0" FontSize="14" Foreground="#FFBABAA8" />
<Label x:Name="labelNewProjectStep03" Content="Search" Margin="0,0,0,0" FontSize="14" Foreground="#FFBABAA8" />
<!-- //Left content -->
</StackPanel>
<StackPanel x:Name="stackPanelRight" Grid.Row="0" Grid.Column="1">
<!-- Right content -->
<DockPanel x:Name="dockPanelMain" LastChildFill="False">
<local:NewProjectStep01ProjectInformationUserControl x:Name="newProjectStep01ProjectInformationUserControl" Panel.ZIndex="0" />
<local:NewProjectStep02AutomatedTasksUserControl x:Name="NewProjectStep02AutomatedTasksUserControl" Panel.ZIndex="1" />
<local:NewProjectStep03SearchUserControl x:Name="NewProjectStep03SearchUserControl" Panel.ZIndex="2" />
</DockPanel>
<!-- //Right content -->
</StackPanel>
</Grid>
</StackPanel>
<!-- //Main -->
<!-- Footer -->
<StackPanel x:Name="stackPanelFooter" Grid.Row="1" Grid.Column="0">
<Border BorderBrush="#FF323232" BorderThickness="1" DockPanel.Dock="Top" Padding="0,0,0,0">
<Grid Background="#FF45474A">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="400" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<StackPanel Grid.Column="1" Orientation="Horizontal" Margin="0,20,0,20">
<Button x:Name="buttonPrevious" Content=" Previous " VerticalAlignment="Bottom" Click="buttonPrevious_Click" Style="{StaticResource btn_default}" HorizontalAlignment="Left" Margin="0,0,10,0" />
<Button x:Name="buttonNext" Content=" Next " VerticalAlignment="Bottom" Click="buttonNext_Click" Style="{StaticResource btn_default_success}" HorizontalAlignment="Left" />
</StackPanel>
</Grid>
</Border>
</StackPanel>
<!-- //Footer -->
</Grid>
</Window>
The program is C# WPF with .NETFramework v4.7.2.
For Main, I replaced stackpanel with Grid layout and added VerticalAlignment="Stretch".
<Grid x:Name="stackPanelMain" Grid.Row="0" Grid.Column="0" VerticalAlignment="Stretch" >
<Grid Background="#FF45474A" VerticalAlignment="Stretch" >
<Grid.RowDefinitions>
<RowDefinition Height="400*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="400" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<StackPanel x:Name="stackPanelLeft" Grid.Row="0" Grid.Column="0" Background="#FF393939" Margin="0,0,20,0">
<!-- Left content -->
<Label x:Name="labelProjects" Content="New project" Margin="0,20,0,0" FontSize="16" Foreground="#FFBABAA8" FontWeight="Bold"/>
<Label x:Name="labelNewProjectStep01" Content="Project information" Margin="0,0,0,0" FontSize="14" Foreground="#FFBABAA8" FontStyle="Italic" />
<Label x:Name="labelNewProjectStep02" Content="Automated tasks" Margin="0,0,0,0" FontSize="14" Foreground="#FFBABAA8" />
<Label x:Name="labelNewProjectStep03" Content="Search" Margin="0,0,0,0" FontSize="14" Foreground="#FFBABAA8" />
<!-- //Left content -->
</StackPanel>
<StackPanel x:Name="stackPanelRight" Grid.Row="0" Grid.Column="1">
<!-- Right content -->
<DockPanel x:Name="dockPanelMain" LastChildFill="False">
<!--<local:NewProjectStep01ProjectInformationUserControl x:Name="newProjectStep01ProjectInformationUserControl" Panel.ZIndex="0" />
<local:NewProjectStep02AutomatedTasksUserControl x:Name="NewProjectStep02AutomatedTasksUserControl" Panel.ZIndex="1" />
<local:NewProjectStep03SearchUserControl x:Name="NewProjectStep03SearchUserControl" Panel.ZIndex="2" />-->
</DockPanel>
<!-- //Right content -->
</StackPanel>
</Grid>
</Grid>

WPF button content (vector drawing) not visible

I have in resource dictionary Buttons.xml two vector drawings for to be shown as a button content.
<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Viewbox
x:Key="BlueMinusButton"
Height="20"
Stretch="Uniform">
<Canvas
Width="100"
Height="100">
<Canvas.LayoutTransform>
<ScaleTransform
ScaleX="1"
ScaleY="-1"
CenterX=".5"
CenterY=".5" />
</Canvas.LayoutTransform>
<Ellipse
Canvas.Left="0"
Canvas.Top="0"
Height="100"
Width="100"
Fill="Blue" />
<Line
X1="10"
X2="90"
Y1="50"
Y2="50"
Fill="Black"
StrokeThickness="10"
Stroke="Black" />
</Canvas>
</Viewbox>
<Viewbox
x:Key="GreenPlusButton"
Height="20"
Stretch="Uniform">
<Canvas
Width="100"
Height="100">
<Canvas.LayoutTransform>
<ScaleTransform
ScaleX="1"
ScaleY="-1"
CenterX=".5"
CenterY=".5" />
</Canvas.LayoutTransform>
<Ellipse
Canvas.Left="0"
Canvas.Top="0"
Height="100"
Width="100"
Fill="Green" />
<Line
X1="10"
X2="90"
Y1="50"
Y2="50"
Fill="Black"
StrokeThickness="10"
Stroke="Black" />
<Line
X1="50"
X2="50"
Y1="10"
Y2="90"
Fill="Black"
StrokeThickness="10"
Stroke="Black" />
</Canvas>
</Viewbox>
</ResourceDictionary>
In view1.xaml I have three buttons and other controls and I use from resources same content for two buttons.
<UserControl
x:Class="ApplicationName.View1"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:local="clr-namespace:ApplicationName">
<UserControl.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary
Source="Buttons.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</UserControl.Resources>
<Grid>
<Grid.RowDefinitions>
<RowDefinition
Height="Auto" />
<RowDefinition
Height="Auto" />
<RowDefinition
Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition
Width="*" />
<ColumnDefinition
Width="Auto" />
</Grid.ColumnDefinitions>
<Label
Grid.Column="0"
Grid.Row="0"
Content="Object1" />
<Button
Grid.Column="1"
Grid.Row="0"
Content="{StaticResource BlueMinusButton}"
Command="{Binding DoCommand1}" />
<Label
Grid.Column="0"
Grid.Row="1"
Content="Object2" />
<Button
Grid.Column="1"
Grid.Row="1"
Content="{StaticResource GreenPlusButton}"
Command="{Binding DoCommand2}" />
<Label
Grid.Column="0"
Grid.Row="2"
Content="Object3" />
<Button
Grid.Column="1"
Grid.Row="2"
Content="{StaticResource GreenPlusButton}"
Command="{Binding DoCommand3}" />
</Grid>
</UserControl>
view1.xaml is used in view2.xaml.
<UserControl
x:Class="ApplicationName.View2"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="ApplicationName">
<Grid>
<StackPanel>
<Label
Content="Controls" />
<local:View1
DataContext="{Binding View1Context}"/>
<Label
Content="Other controls" />
</StackPanel>
</Grid>
</UserControl>
Here comes the problem: When looking the view2.xaml in xaml editor, the content for the middle button is missing. Same happens in run time. If I look view1.xaml in xaml editor, all the button contents are visible. Here is a picture from the views:
Why the content is not shown and how do I get it back?
Set x:Shared="False" for your each ViewBoxif you want to useit in multiple places.

WPF telerik RadRibbonView and RadRibbonWindow

I am using Telerik WPF UI RadRibbonWindow, RadRibbonView in my application. I have inherited RadRibbonWindow in the MainWindow class. I have added the proper Dlls for that with same version, but the control is not visible in Window. How can I solve this visibility problem? The project is building successfully.
<telerik:RadRibbonWindow x:Class="WpfApplication2.MainWindow"
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"
xmlns:local="clr-namespace:WpfApplication2"
xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="400">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="auto"/>
<RowDefinition Height="*"/>
<RowDefinition Height="25"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1*"/>
<ColumnDefinition Width="auto"/>
<ColumnDefinition Width="3*"/>
</Grid.ColumnDefinitions>
<telerik:RadRibbonView x:Name="theRibbon" Grid.Row="0" Grid.ColumnSpan="3">
<!-- Ribbon Tab #1: Home -->
<telerik:RadRibbonTab Header="Home" telerik:KeyTipService.AccessText="H">
<telerik:RadRibbonGroup Header="Clipboard">
<telerik:RadRibbonButton LargeImage="/Resources/Icons/cut.png" Text="Cut"/>
<telerik:RadRibbonButton LargeImage="/Resources/Icons/paste.png" Text="Paste" />
<telerik:RadRibbonButton LargeImage="/Resources/Icons/copy.png" Text="Copy" />
</telerik:RadRibbonGroup>
<telerik:RadRibbonGroup Header="Show">
<telerik:RadRibbonButton Text="Close Table" Size="Large"
LargeImage="/Resources/Icons/closetable.png"/>
<telerik:RadRibbonButton Text="Close All" Size="Large"
LargeImage="/Resources/Icons/closeall.png"/>
<!--<Fluent:Button Header="Close Table" Click="CloseTable_Click" SizeDefinition="Large, Middle, Small"
Icon="/Resources/Icons/closetable.png" LargeIcon="/Resources/Icons/closetable.png"/>-->
<StackPanel Orientation="Horizontal" Margin="2">
<CheckBox IsChecked="True"
VerticalAlignment="Center" HorizontalAlignment="Center" Width="15" Height="15"
/>
<telerik:Label Content="Status bar" Padding="0" Margin="5,0,0,0"/>
</StackPanel>
<StackPanel Orientation="Horizontal" Margin="2">
<CheckBox VerticalAlignment="Center" IsChecked="True"
HorizontalAlignment="Center" Width="15" Height="15">
</CheckBox>
<telerik:Label Content="Folder list" Padding="0" Margin="5,0,0,0"/>
</StackPanel>
</telerik:RadRibbonGroup>
<telerik:RadRibbonGroup Header="Publish">
<telerik:RadRibbonButton Name="printBtn" LargeImage="/Resources/Icons/print.png" Text="Print..." telerik:KeyTipService.AccessText="P" />
<telerik:RadRibbonButton Name="exportBtn" LargeImage="/Resources/Icons/export.png" Text="Export..." telerik:KeyTipService.AccessText="E" />
</telerik:RadRibbonGroup>
<telerik:RadRibbonGroup Header="Edit">
<telerik:RadToggleButton Name="lockBtn" />
<telerik:RadRibbonButton Name="appendRowBtn" Size="Large, Medium, small" SmallImage="/Resources/Icons/appendrow.png"
LargeImage="/Resources/Icons/appendrow.png" Text="Append Row" />
<telerik:RadRibbonButton Name="addAboveBtn" LargeImage="/Resources/Icons/addabove.png"
Text="Add Above" VerticalContentAlignment="Center"/>
<telerik:RadRibbonButton Name="addBelowBtn" LargeImage="/Resources/Icons/addbelow.png" Text="Add Below" />
<telerik:RadRibbonButton Name="deleteRowBtn" LargeImage="/Resources/Icons/deleterow.png" Text="Delete Row" />
<telerik:RadRibbonButton Name="commitBtn" Size="Medium" SmallImage="/Resources/Icons/commit.png" Text="Commit" />
<telerik:RadRibbonButton Name="rollbackBtn" Size="Medium" SmallImage="/Resources/Icons/commit.png" Text="Rollback"/>
</telerik:RadRibbonGroup>
<telerik:RadRibbonGroup Header="Font">
<StackPanel Orientation="Horizontal" Margin="2,5">
<telerik:RadComboBox Name="fontComboBox" Width="120" Margin="0" IsEditable="True"
ToolTip="Font" SelectedIndex="0"
IsReadOnly="True" >
<telerik:RadComboBoxItem Content="Time New Roman"/>
<telerik:RadComboBoxItem Content="Arial"/>
<telerik:RadComboBoxItem Content="Century Gothic"/>
<telerik:RadComboBoxItem Content="Comic Sans MS"/>
<telerik:RadComboBoxItem Content="Calibri"/>
</telerik:RadComboBox>
<telerik:RadComboBox Name="fontSizeComboBox" Width="40"
ToolTip="Font Size"
SelectedIndex="1"
IsReadOnly="True"
IsEditable="True"
Margin="0" >
<telerik:RadComboBoxItem Content="10"/>
<telerik:RadComboBoxItem Content="12"/>
<telerik:RadComboBoxItem Content="14"/>
<telerik:RadComboBoxItem Content="16"/>
<telerik:RadComboBoxItem Content="18"/>
</telerik:RadComboBox>
<StackPanel Orientation="Horizontal" Margin="2">
<CheckBox Name="AltCheckBox" Width="20" VerticalAlignment="Center" />
<TextBlock VerticalAlignment="Center" Text="Alternate"/>
</StackPanel>
</StackPanel>
</telerik:RadRibbonGroup>
<telerik:RadRibbonGroup Header="Search">
<TextBox x:Name="searchBox" FocusManager.IsFocusScope="True" Margin="2"
HorizontalAlignment="Right" VerticalAlignment="Center" />
</telerik:RadRibbonGroup>
</telerik:RadRibbonTab>
</telerik:RadRibbonView>
and I am inheriting as:
public partial class MainWindow :RadRibbonWindow { public MainWindow () { InitializeComponent (); }
dlls added by me:
Telerik.Windows.Controls, Telerik.Windows.Controls.Input, Telerik.Windows.Controls.Navigation, Telerik.Windows.Controls.RibbonView, I have added these assemblies with same versions. 2016.2.613.45 And I am Using VS2013 Telerik.Windows.Controls.Data,
what changes should i made in code so that RadRibbonWindow will be visible in mainWindow, here I have created WPF Application project.

How to glue 2 labels together WPF

I am working on small wpf application and I can say this is my first wpf application
from the beginning.
I have problem here because I want to glue two labels together (see image below), because when I run app on smaller or bigger monitor they will be too much away from each other, and what I Want to do is to keep them together all the time and verticaly centered, so thats reason why I created grid and why I put stack panel inside, so maybe I could apply verticalalignment = 'center' to stack panel and content would be centered or whatever?
I am not sure is this code ok, so please guys comment it, I want to improve my skills about
WPF, so be free to tell me another solutions or whatever, maybe I wrote too much code or smth?
Anyway, how could I glue up this two labes to keep them near each other all the time and to keep them also centered all the time on different size of monitors.
Thanks a lot guys,
Cheers!
MY CODE:
<Window x:Class="xTouchPOS.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525" WindowStartupLocation="CenterScreen" WindowState="Maximized" WindowStyle="None">
<Grid>
<!-- Definition of my Grid which contains 2 columns and 3 rows. -->
<Grid.ColumnDefinitions>
<ColumnDefinition Width="3.5*"/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" MinHeight="65"/>
<RowDefinition Height="*"/>
<RowDefinition Height="0.143*" />
</Grid.RowDefinitions>
<!-- Added this rectangle to colour header of my Grid. -->
<Rectangle Grid.ColumnSpan="3">
<Rectangle.Fill>
<SolidColorBrush Color="#0091EA"></SolidColorBrush>
</Rectangle.Fill>
</Rectangle>
<!-- Added this grid and stackpanel inside this grid to place date and time, but how to glue them together text and value -->
<Grid Grid.Column="1" Grid.Row="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<StackPanel Grid.Column="0" Orientation="Vertical">
<Label x:Name="lblTimeText" Content="Time" Margin="0,0,0,0" FontSize="15" Foreground="White" HorizontalAlignment="Left" FontFamily="Arial" VerticalAlignment="Bottom" />
<Label x:Name="lblTime" Content="labelTime" Grid.Column="0" Margin="0" FontSize="18" Foreground="White" HorizontalAlignment="Left" FontFamily="Arial" />
</StackPanel>
<StackPanel Grid.Column="1" Orientation="Vertical">
<Label Name="lblDateText" Content="Date" Margin="0" FontSize="15" Foreground="White" HorizontalAlignment="Left" FontFamily="Arial" />
<Label Name="lblDate" Content="labelaDate" Margin="0" FontSize="18" Foreground="White" HorizontalAlignment="Left" FontFamily="Arial" />
</StackPanel>
</Grid>
</Grid>
</Window>
CODE BEHIND:
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
lblDate.Content = DateTime.Now.Date.ToString("MM/dd/yyyy");
lblTime.Content = DateTime.Now.ToString("HH:mm:ss");
}
}
If you change your Labels to TextBlocks, I think you will get what you are looking for. You will need to change the column definition.
<Window x:Class="MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
Title="MainWindow" Height="350" Width="525">
<Grid>
<!-- Definition of my Grid which contains 2 columns and 3 rows. -->
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1.75*"/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" MinHeight="65"/>
<RowDefinition Height="*"/>
<RowDefinition Height="0.143*" />
</Grid.RowDefinitions>
<!-- Added this rectangle to colour header of my Grid. -->
<Rectangle Grid.ColumnSpan="3">
<Rectangle.Fill>
<SolidColorBrush Color="#0091EA"></SolidColorBrush>
</Rectangle.Fill>
</Rectangle>
<!-- Added this grid and stackpanel inside this grid to place date and time, but how to glue them together text and value -->
<Grid Grid.Column="1" Grid.Row="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<StackPanel Grid.Column="0" Orientation="Vertical" VerticalAlignment="Center">
<TextBlock x:Name="lblTimeText" Text="Time" Margin="0,0,0,0" FontSize="15" Foreground="White" HorizontalAlignment="Left" FontFamily="Arial" VerticalAlignment="Bottom" />
<TextBlock x:Name="lblTime" Text="labelTime" Grid.Column="0" Margin="0" FontSize="18" Foreground="White" HorizontalAlignment="Left" FontFamily="Arial" />
</StackPanel>
<StackPanel Grid.Column="1" Orientation="Vertical" VerticalAlignment="Center">
<TextBlock Name="lblDateText" Text="Date" Margin="0" FontSize="15" Foreground="White" HorizontalAlignment="Left" FontFamily="Arial" />
<TextBlock Name="lblDate" Text="labelaDate" Margin="0" FontSize="18" Foreground="White" HorizontalAlignment="Left" FontFamily="Arial" />
</StackPanel>
</Grid>
</Grid>
</Window>
Alternative
If you want to slim down your XAML, this will give the same result. It will also lock the two stack panels to the top right. Replace your Second Grid with this block
<DockPanel Grid.Row="0" Grid.ColumnSpan="2">
<StackPanel Orientation="Vertical" VerticalAlignment="Center" HorizontalAlignment="Right" DockPanel.Dock="Right" Margin="5,0">
<TextBlock Name="lblDateText" Text="Date" Margin="0" FontSize="15" Foreground="White" HorizontalAlignment="Left" FontFamily="Arial" />
<TextBlock Name="lblDate" Text="labelaDate" Margin="0" FontSize="18" Foreground="White" HorizontalAlignment="Left" FontFamily="Arial" />
</StackPanel>
<StackPanel Orientation="Vertical" VerticalAlignment="Center" HorizontalAlignment="Right" DockPanel.Dock="Right" Margin="5,0">
<TextBlock x:Name="lblTimeText" Text="Time" Margin="0,0,0,0" FontSize="15" Foreground="White" HorizontalAlignment="Left" FontFamily="Arial" VerticalAlignment="Bottom" />
<TextBlock x:Name="lblTime" Text="labelTime" Grid.Column="0" Margin="0" FontSize="18" Foreground="White" HorizontalAlignment="Left" FontFamily="Arial" />
</StackPanel>
</DockPanel>
Add other stackPanel with Orientation="Horizontal"
<StackPanel Grid.Column="0" Orientation="Horizontal" >
<StackPanel Orientation="Vertical">
<Label x:Name="lblTimeText" Content="Time" Margin="0,0,0,0" FontSize="15" Foreground="White" HorizontalAlignment="Left" FontFamily="Arial" VerticalAlignment="Bottom" />
<Label x:Name="lblTime" Content="labelTime" Grid.Column="0" Margin="0" FontSize="18" Foreground="White" HorizontalAlignment="Left" FontFamily="Arial" />
</StackPanel>
<StackPanel Orientation="Vertical">
<Label Name="lblDateText" Content="Date" Margin="0" FontSize="15" Foreground="White" HorizontalAlignment="Left" FontFamily="Arial" />
<Label Name="lblDate" Content="labelaDate" Margin="0" FontSize="18" Foreground="White" HorizontalAlignment="Left" FontFamily="Arial" />
</StackPanel>
Other solution:you can use run
<TextBlock Grid.Column="1">
<TextBlock TextWrapping="Wrap" >
<Run x:Name="lblTimeText" />
<Run x:Name="lblTime"/>
</TextBlock>
</TextBlock>

Flickering and blurry text

I have an issue with a text. In some custom usercontrols it is flickering every more/less second (probably when rendering) here is a gif:
I'm using these render and text options for now which are applied on Window:
RenderOptions.ClearTypeHint="Enabled"
TextOptions.TextFormattingMode="Display"
RenderOptions.BitmapScalingMode="HighQuality"
I was using these before:
RenderOptions.ClearTypeHint="Enabled"
RenderOptions.BitmapScalingMode="Linear"
TextOptions.TextRenderingMode="Grayscale"
TextOptions.TextFormattingMode="Display"
and it was ok but the text was too sharp.
XAML of this specific component:
<UserControl x:Class="FunctionButton" x:Name="PART_Base"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:dxmvvm="http://schemas.devexpress.com/winfx/2008/xaml/mvvm" xmlns:ViewModels="clr-namespace:SkyPCTool"
xmlns:materialDesign="clr-namespace:MaterialDesignThemes.Wpf;assembly=MaterialDesignThemes.Wpf"
mc:Ignorable="d"
TextElement.FontWeight="Medium"
TextElement.FontSize="14"
FontFamily="pack://application:,,,/MaterialDesignThemes.Wpf;component/Resources/Roboto/#Roboto"
MinHeight="52" d:DesignWidth="300" Margin="0">
<UserControl.DataContext>
<ViewModels:FunctionButtonViewModel/>
</UserControl.DataContext>
<UserControl.Resources>
<ViewModels:TextToVisibilityConverter x:Key="textConverter" />
</UserControl.Resources>
<Border CornerRadius="2" Background="{StaticResource MaterialDesignPaper}">
<Grid Margin="12,6">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="3*" />
</Grid.ColumnDefinitions>
<Button x:Name="PART_Button" HorizontalAlignment="Center" VerticalAlignment="Center" Padding="12,6" Content="{Binding ButtonCaption}" />
<Grid Grid.Column="1" Margin="6,0">
<Image Source="{Binding Icon}" ToolTip="{Binding IconTag}" />
</Grid>
<Grid Grid.Column="2" SnapsToDevicePixels="True">
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<TextBlock Grid.Row="0" Text="{Binding Title}" RenderOptions.ClearTypeHint="Enabled" VerticalAlignment="Center" TextTrimming="CharacterEllipsis" FontSize="14" />
<TextBlock Grid.Row="1" Text="{Binding Description}" RenderOptions.ClearTypeHint="Enabled" Margin="12,0,0,0" Visibility="{Binding Text, RelativeSource={RelativeSource Self}, Converter={StaticResource textConverter}}" FontWeight="Normal" VerticalAlignment="Center" TextWrapping="Wrap" FontSize="12.667" />
</Grid>
</Grid>
</Border>
I did it. I downloaded the Roboto font from Google website, then I set these options on Window:
RenderOptions.ClearTypeHint="Enabled"
TextOptions.TextFormattingMode="Ideal"
TextOptions.TextHintingMode="Animated"
TextOptions.TextRenderingMode="ClearType"

Resources