WPF Mahapps Hamburger Menu open User Control with extended constructor - c#

I'm using exactly this Hamburger menu example
https://jkarger.de/2017/02/06/mahapps-hamburgermenu/
This works fine as long the views have the default constructor.
However I need to pass an object from the MetroWindow, where the Hamburger menu is implemented, to a UserControl called by clicking a menu item.
The XAML code for the menu item is like this.
<controls:HamburgerMenu.ItemsSource>
<controls:HamburgerMenuItemCollection>
<controls:HamburgerMenuGlyphItem Glyph="" Label="Home">
<controls:HamburgerMenuGlyphItem.Tag>
<views:main />
</controls:HamburgerMenuGlyphItem.Tag>
</controls:HamburgerMenuGlyphItem>
<controls:HamburgerMenuGlyphItem Glyph="" Label="Private">
<controls:HamburgerMenuGlyphItem.Tag>
<views:private />
</controls:HamburgerMenuGlyphItem.Tag>
</controls:HamburgerMenuGlyphItem>
<controls:HamburgerMenuGlyphItem Glyph="" Label="Settings">
<controls:HamburgerMenuGlyphItem.Tag>
<views:settings />
</controls:HamburgerMenuGlyphItem.Tag>
</controls:HamburgerMenuGlyphItem>
</controls:HamburgerMenuItemCollection>
</controls:HamburgerMenu.ItemsSource>
For instance the "main" view.
<controls:HamburgerMenuGlyphItem.Tag>
<views:main />
</controls:HamburgerMenuGlyphItem.Tag>
This is the constructor of my "main" UserControl.
#region PUBLIC_PROPERTIES
TesterConfig.TesterConfig tc;
#endregion
public main(TesterConfig.TesterConfig configuration)
{
InitializeComponent();
tc = configuration;
}
XAML for the "main" UserControl"
<UserControl x:Class="TestsystemConfiguration.Views.main"
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:Controls="clr-namespace:MahApps.Metro.Controls;assembly=MahApps.Metro"
xmlns:local="clr-namespace:TestsystemConfiguration.Views"
mc:Ignorable="d"
d:DesignHeight="450" d:DesignWidth="800">
<Grid x:Name="gridMain">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="130"/>
<ColumnDefinition Width="423*"/>
<ColumnDefinition Width="175"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="70"/>
<RowDefinition Height="8"/>
<RowDefinition Height="36"/>
<RowDefinition Height="36"/>
<RowDefinition Height="36"/>
<RowDefinition Height="11*"/>
<RowDefinition Height="45*"/>
<RowDefinition Height="40"/>
</Grid.RowDefinitions>
<Image x:Name="imageLogo" Grid.Column="2" Source="pack://siteoforigin:,,,/Resources/logo.png" Margin="5" Grid.RowSpan="1"/>
<ComboBox x:Name="cbWorkingStation" IsEnabled="False" Grid.Column="1" Margin="5,2,10,2" Grid.Row="2" SelectionChanged="cbWorkingStation_SelectionChanged"/>
<Button x:Name="btnOpenDocs" Content="Doku öffnen" Style="{StaticResource AccentedSquareButtonStyle}" Grid.Column="2" Margin="5" Grid.Row="7" Controls:ControlsHelper.ContentCharacterCasing="Upper"/>
<Label Content="Arbeitsplatz:" Grid.Row="2" FontWeight="Bold"/>
</Grid>
</UserControl>
The "TesterConfig" is an object in my project and declared in the parent MetroWindow. How can I pass the reference to the UserControl?
Thanks for your help!

Thanks #mm8.
According to your suggestions I did it this way.
XAML (MenuItem)
<Controls:HamburgerMenuGlyphItem Glyph=""
Label="Home"
Tag="main">
</Controls:HamburgerMenuGlyphItem>
C# Code:
private void MenuControl_ItemClick(object sender, ItemClickEventArgs e)
{
HamburgerMenuGlyphItem i = e.ClickedItem as HamburgerMenuGlyphItem;
if(i != null)
{
UserControl uc = new UserControl();
switch(i.Tag.ToString())
{
case "main":
uc = new Views.main(tc);
break;
case "testsystems":
uc = new Views.testsystems();
break;
}
i.Tag = uc;
this.MenuControl.Content = i;
}
}
I created a switch depending on the tag.
Thanks for your help!
Best,
Andy

Related

WPF hide a row, but empty space doesn't sweep out

I have a wpf window with a grid. I would like to hide rows and I do with this code as shown in other stackoverflow threads:
buttonsGrid.Visibility = Visibility.Collapsed; or buttonsGrid.Height = 0;
dayTimePicker.Visibility = Visibility.Collapsed; or dayTimePicker.Height = 0;
Set Visibility to Collapsed or Height to 0 gives the same effect, but I would like the white space occupied by these Rows to sweep ... I would like the whole window to be occupied by the indexed row 0. .. How can I do it?
This is my window:
<Window x:Class="PerformanceVideoRec.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:wf="clr-namespace:System.Windows.Forms;assembly=System.Windows.Forms"
xmlns:DTControl="clr-namespace:DayTimePickControl"
Title="{StaticResource ID_TITLE}" Height="600" Width="900" Loaded="Window_Loaded"> <!--Closing="Window_Closing"> -->
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid Grid.Row="1" x:Name="ControlPart" IsEnabled="False">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="6*"/>
<ColumnDefinition Width="3*"/>
</Grid.ColumnDefinitions>
<Grid Grid.Column="0" x:Name="LeftGrid">
<Grid.RowDefinitions>
<RowDefinition Height="55*"/>
<RowDefinition Height="5*"/>
<RowDefinition Height="5*"/>
<RowDefinition Height="20*"/>
</Grid.RowDefinitions>
<WindowsFormsHost Grid.Row="0" Margin="5" Background="Gray">
<wf:PictureBox x:Name="playWindow"></wf:PictureBox>
</WindowsFormsHost>
<UniformGrid Grid.Row="1">
<Button x:Name="btnShowHideControls" Content="Nascondi Controlli" Click="btnShowHideControls_Click"/>
</UniformGrid>
<UniformGrid Columns="6" Grid.Row="2" x:Name="buttonsGrid">
<Button x:Name="btnPause" Margin="5" Width="50" Content="{StaticResource ID_PAUSE}" Click="btnPause_Click"></Button>
<Button x:Name="btnPlay" Margin="5" Width="50" Content="{StaticResource ID_PLAY}" Click="btnPlay_Click" Visibility="Collapsed"/>
<Button x:Name="btnStop" Margin="5" Width="50" Content="{StaticResource ID_STOP}" Click="btnStop_Click"></Button>
<Button x:Name="btnSlow" Margin="5" Width="50" Content="{StaticResource ID_SLOW}" Click="btnSlow_Click"></Button>
<TextBox x:Name="tbSpeed" IsEnabled="False" Width="50" Height="25" TextAlignment="Center" VerticalContentAlignment="Center" Text="1X" />
<Button x:Name="btnFast" Margin="5" Width="50" Content="{StaticResource ID_FAST}" Click="btnFast_Click"></Button>
<Button x:Name="btnNormal" Margin="5" Width="50" Content="{StaticResource ID_NORMAL}" Click="btnNormal_Click"></Button>
</UniformGrid>
<DTControl:DayTimePick x:Name="dayTimePicker" Grid.Row="3" Width="550" Height="100" Grid.RowSpan="2" OnTimeClick="dayTimePicker_OnTimeClick"></DTControl:DayTimePick>
</Grid>
<Frame x:Name="PlayBackFrame" Grid.Column="1" Background="AliceBlue" ></Frame>
</Grid>
</Grid>
The MVVM way:
make a separate view model for the part of UI you want to collapse. Let's call it PlayViewModel,
make a DataTemplate for it,
expose it as a property (e.g. let's call it Play, don't forget to raise property change event) in the view model which is a DataContext for the whole view
you display it in your grid with ContentPresenter, ContentPresenter.Content bound to Play property
you do hiding by null-ing Play property, you show it by restoring it.
You get testability for free.
You could use Data Binding and bind the the property Visibility of the control inside the row you want to collapse with a converter.
I usually use the NuGet package Mvvm Light, documentation to have some facilities while using Data Binding. (In this case RelayCommand, RaisePropertyChanged implementation)
A very basic example:
Part of the view. Here you can notice the Binding between the Visibility property of the button and the property IsButton1Visible of the ViewModel. Of course bool and Visibility aren't the same type, so I had to create a mapping using an IValueConverter:
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Button Grid.Row="0" Content="1" Visibility="{Binding IsButton1Visible, Converter={StaticResource BooleanToVisibilityConverter}}" />
<Button Grid.Row="1" Content="2" />
<Button Grid.Row="2" Content="3" />
<Button Grid.Row="3" Content="4" />
<Button Grid.Row="4" Content="Toggle button 1 visibility" Command="{Binding ToggleButton1Visibility}" />
</Grid>
The window's constructor in the code behind (you could also bind the ViewModel via the DataContext property directly into the View), used to associate the View with the ViewModel:
public MainWindow()
{
InitializeComponent();
this.DataContext = new MyWindowViewModel();
}
The converter to convert true to Visibility.Visible:
public class BooleanToVisibilityConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
=> (bool)value ? Visibility.Visible : Visibility.Collapsed;
public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
{
throw new NotImplementedException();
}
}
App.xaml, Application.Resource part, used to make the View "see" the converter:
<Application.Resources>
<local:BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter" />
</Application.Resources>
The ViewModel. Here RaisePropertyChanged of set method of IsButton1Visible is very important because it notifies the View that the property is changed, so that the View can refresh itself:
public class MyWindowViewModel : ViewModelBase
{
private bool _isButton1Visibile = true;
public bool IsButton1Visible
{
get => _isButton1Visibile;
set
{
if (_isButton1Visibile == value)
return;
_isButton1Visibile = value;
RaisePropertyChanged(nameof(IsButton1Visible));
}
}
RelayCommand _toggleButton1Visbility;
public RelayCommand ToggleButton1Visibility
{
get
{
return _toggleButton1Visbility ?? (_toggleButton1Visbility = new RelayCommand(
() =>
{
IsButton1Visible = !IsButton1Visible;
}));
}
}
}
LeftGrid.RowDefinitions[2].Height = new GridLength(0);
LeftGrid.RowDefinitions[3].Height = new GridLength(0);
If you want to restore make this
LeftGrid.RowDefinitions[2].Height = new GridLength(5, GridUnitType.Star);
LeftGrid.RowDefinitions[3].Height = new GridLength(20, GridUnitType.Star);

add thickness = 1, outline for borders,rows and columns of grids inside grids in wpf

I have following WPF XAML file,
<Window x:Class="Program"
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:Program"
mc:Ignorable="d"
Title="Print Preview" Height="40820.962" Width="2135.146">
<Grid Margin="10,10,2,-21" Height="40801" VerticalAlignment="Top">
<Grid.ColumnDefinitions>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="131*"/>
<RowDefinition Height="40670*"/>
</Grid.RowDefinitions>
<Grid HorizontalAlignment="Left" Height="3438" Margin="20,126,0,0" VerticalAlignment="Top" Width="2095" Grid.RowSpan="2">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="500*"/>
<ColumnDefinition Width="1072*"/>
<ColumnDefinition Width="523*"/>
</Grid.ColumnDefinitions>
<Label x:Name="label5" Content="Here" Grid.Column="1" HorizontalAlignment="Left" Margin="10,10,0,0" VerticalAlignment="Top" RenderTransformOrigin="-7.455,-0.374" Height="58" Width="171" FontSize="16"/>
</Grid>
<Grid HorizontalAlignment="Right" Height="432" Margin="0,3453,1605,0" Grid.Row="1" VerticalAlignment="Top" Width="490" RenderTransformOrigin="0.62,1.205">
<Grid.RowDefinitions>
<RowDefinition Height="143*"/>
<RowDefinition Height="136*"/>
<RowDefinition Height="153*"/>
</Grid.RowDefinitions>
</Grid>
<Grid HorizontalAlignment="Right" Height="452" Margin="0,3433,1605,0" Grid.Row="1" VerticalAlignment="Top" Width="490" RenderTransformOrigin="0.62,1.205">
<Grid.RowDefinitions>
<RowDefinition Height="143*"/>
<RowDefinition Height="136*"/>
<RowDefinition Height="153*"/>
</Grid.RowDefinitions>
</Grid>
<Grid HorizontalAlignment="Left" Height="447" Margin="1594,3438,0,0" Grid.Row="1" VerticalAlignment="Top" Width="511">
<Grid.RowDefinitions>
<RowDefinition Height="142*"/>
<RowDefinition Height="156*"/>
<RowDefinition Height="149*"/>
</Grid.RowDefinitions>
</Grid>
<Grid HorizontalAlignment="Left" Height="452" Margin="510,3433,0,0" Grid.Row="1" VerticalAlignment="Top" Width="1084">
<Grid.RowDefinitions>
<RowDefinition Height="44*"/>
<RowDefinition Height="45*"/>
</Grid.RowDefinitions>
</Grid>
<Grid HorizontalAlignment="Left" Height="23141" Margin="20,3895,0,0" Grid.Row="1" VerticalAlignment="Top" Width="1574"/>
<Grid HorizontalAlignment="Left" Height="23540" Margin="1599,3496,0,0" Grid.Row="1" VerticalAlignment="Top" Width="506">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="14.143"/>
<ColumnDefinition Width="146.857"/>
<ColumnDefinition Width="42.714"/>
<ColumnDefinition Width="119*"/>
<ColumnDefinition Width="98*"/>
<ColumnDefinition Width="85*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="87*"/>
<RowDefinition Height="23516*"/>
</Grid.RowDefinitions>
<Label x:Name="label" Content="Hespanic" HorizontalAlignment="Left" Margin="-1,-61,0,0" VerticalAlignment="Top" Height="55" Width="506" FontSize="22" Grid.ColumnSpan="6"/>
</Grid>
<Label x:Name="label1" Content="Sample" HorizontalAlignment="Left" Margin="8,97,0,0" VerticalAlignment="Top" RenderTransformOrigin="-8.5,0.654" Width="215"/>
<Label x:Name="label2" Content="Layer" HorizontalAlignment="Left" Height="33" Margin="922,10,0,0" VerticalAlignment="Top" Width="232" FontSize="18"/>
<Label x:Name="label3" Content="Index" HorizontalAlignment="Left" Margin="1969,10,0,0" VerticalAlignment="Top" Width="105"/>
<Label x:Name="label4" Content="People" HorizontalAlignment="Left" Margin="1477,84,0,0" VerticalAlignment="Top" Width="161"/>
</Grid>
</Window>
So I'm trying to add thickness = 1, outline for grid borders, rows and columns
So I tried following thread
How do i put a border on my grid in WPF?
So to add a border I added following thing, and its working fine
<Border BorderBrush="Black" BorderThickness="2">
<Grid>
<!-- Grid contents here -->
</Grid>
</Border>
But since I have need to add thickness = 1, outline for all above multiple columns and rows also, I tried something like this
</Grid.ColumnDefinitions>
<Border Grid.Row="0" Grid.Column="0" BorderThickness="1" BorderBrush="Black"/>
<Border Grid.Row="0" Grid.Column="1" BorderThickness="1" BorderBrush="Black"/>
which is identifying each column and row and add thickness to them, but this seems quite time consuming and confusing work.
Is there any other proper and quick way to add BorderThickness="1" BorderBrush="Black" to all above Columns and Rows in the grids ?
In the default WPF Grid, you can set ShowGridLines="True". However these lines are meant to be designer lines, and not meant for end use.
The common solution I use is a custom GridControl which adds DependencyProperties for GridLines settings, and overrides OnRender to draw them.
public class GridControl : Grid
{
#region Properties
public bool ShowCustomGridLines
{
get { return (bool)GetValue(ShowCustomGridLinesProperty); }
set { SetValue(ShowCustomGridLinesProperty, value); }
}
public static readonly DependencyProperty ShowCustomGridLinesProperty =
DependencyProperty.Register("ShowCustomGridLines", typeof(bool), typeof(GridControl), new UIPropertyMetadata(false));
public Brush GridLineBrush
{
get { return (Brush)GetValue(GridLineBrushProperty); }
set { SetValue(GridLineBrushProperty, value); }
}
public static readonly DependencyProperty GridLineBrushProperty =
DependencyProperty.Register("GridLineBrush", typeof(Brush), typeof(GridControl), new UIPropertyMetadata(Brushes.Black));
public double GridLineThickness
{
get { return (double)GetValue(GridLineThicknessProperty); }
set { SetValue(GridLineThicknessProperty, value); }
}
public static readonly DependencyProperty GridLineThicknessProperty =
DependencyProperty.Register("GridLineThickness", typeof(double), typeof(GridControl), new UIPropertyMetadata(1.0));
#endregion
protected override void OnRender(DrawingContext dc)
{
if (ShowCustomGridLines)
{
foreach (var rowDefinition in RowDefinitions)
{
dc.DrawLine(new Pen(GridLineBrush, GridLineThickness), new Point(0, rowDefinition.Offset), new Point(ActualWidth, rowDefinition.Offset));
}
foreach (var columnDefinition in ColumnDefinitions)
{
dc.DrawLine(new Pen(GridLineBrush, GridLineThickness), new Point(columnDefinition.Offset, 0), new Point(columnDefinition.Offset, ActualHeight));
}
dc.DrawRectangle(Brushes.Transparent, new Pen(GridLineBrush, GridLineThickness), new Rect(0, 0, ActualWidth, ActualHeight));
}
base.OnRender(dc);
}
static GridControl()
{
DefaultStyleKeyProperty.OverrideMetadata(typeof(GridControl), new FrameworkPropertyMetadata(typeof(GridControl)));
}
}
It can be used like this :
<local:GridEx ShowCustomGridLines="True"
GridLineBrush="#FF38B800"
GridLineThickness="2">
...
</local:GridEx>

RDLC report not showing up inside a user control

I am trying to show a rdlc report inside a user control. The problem is that it does not show when I run the project.
Before running the project I can see it in xaml designer.
After Running project:
Here is my code:
Report User Control:
<UserControl x:Class="CPOSApplication.UserControls.Reports.ReportViewer"
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"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="300" Background="#FFFFFFFF"
xmlns:repview="clr-namespace:Microsoft.Reporting.WinForms;assembly=Microsoft.ReportViewer.WinForms">
<Grid>
<WindowsFormsHost x:Name="winform" Background="White" Visibility="Visible">
<repview:ReportViewer BackColor="white" x:Name="salesReportViewer"/>
</WindowsFormsHost>
</Grid>
Another UserControl where it is being used:
<UserControl x:Class="CPOSApplication.UserControls.Reports.SalesReport"
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:uc="clr-namespace:CPOSApplication.UserControls.Reports"
mc:Ignorable="d"
d:DesignHeight="800" d:DesignWidth="900">
<Grid Style="{DynamicResource GridsCustomStyle}" x:Name="SearchShelfGri">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition MinWidth="100" />
</Grid.ColumnDefinitions>
<Border Grid.ColumnSpan="2" Style="{DynamicResource SearchGridHeaderBorder}">
<DockPanel Grid.Row="0">
<Label x:Name="GridLabel" Style="{DynamicResource HeadingLabelsCustomStyle}" Content="Sales Report-:"/>
</DockPanel>
</Border>
<uc:ReportViewer x:Name="salesReport" Grid.Column="0" Background="White" Grid.Row="1" Margin="0,0"/>
<uc:FilterSalesReport x:Name="filterShelf" Grid.Column="1" Grid.Row="1" Background="AliceBlue" Width="300" Padding="2,0,0,0" Margin="0,0"/>
</Grid>
It's .cs File
public partial class SalesReport : UserControl
{
public SalesReport()
{
InitializeComponent();
salesReport.salesReportViewer.ProcessingMode = ProcessingMode.Local;
salesReport.salesReportViewer.LocalReport.ReportPath = #"C:\Users\Safi\Documents\Visual Studio 2012\Projects\CPOS\CPOS\CPOSApplication\Reports\QuarterSaleInvoiceReport.rdlc";
salesReport.salesReportViewer.RefreshReport();
salesReport.salesReportViewer.LocalReport.ReportEmbeddedResource = "CPOSApplication.Reports." + ReportType.QuarterSaleInvoice.ToString() + "Report.rdlc";
salesReport.salesReportViewer.RefreshReport();
}
}
//in your CS file, create this method
public void GenReport()
{
YourReportViewfname.LocalReport.ReportPath = #"paste Your RDLC Location";
YourClass rptclsProp01 = new YourClass();
var data = rptclsProp01.YourList();
ReportDataSource dataSource = new ReportDataSource("YourDataSet", data);
YourReportViewfname.LocalReport.DataSources.Clear();
YourReportViewfname.LocalReport.DataSources.Add(dataSource);
YourReportViewfname.RefreshReport();
YourReportViewfname.Show();
}
//then Button Click event, just call the method
this.YourUCfnam.salesReport.GenReport();
//hope that report will show

how to create a loading page after a button event in wp8 xaml C#

hi i need to how can i make a overlay like page in xaml for windows phone ? Like, if i tap a button it will show a overlay like message loading... and then actually start to work. All i have been able to create a popup in xaml.
<Popup x:Name="myPopup" HorizontalAlignment="Center" VerticalAlignment="Center" >
<Grid >
<Grid.RowDefinitions>
<RowDefinition/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<TextBlock FontSize="25" Grid.Column="1" Margin="20" Text="loading"/>
</Grid>
</Popup>
Can you plz tell me how can make overlay like message ?
If you need and overlay there it is.
First you need an usercontrol.
<UserControl x:Class="ABC.Test.OverLay"
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"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
d:DesignHeight="800" d:DesignWidth="480">
<Grid x:Name="LayoutRoot" Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="400"/>
<RowDefinition Height="400"/>
</Grid.RowDefinitions>
<StackPanel Grid.Row="1">
<ProgressBar IsIndeterminate="True" Foreground="Red" Height="80" Width="480" VerticalAlignment="Center"/>
<TextBlock Text="loading" Foreground="Red" HorizontalAlignment="Center" FontSize="20"/>
</StackPanel>
</Grid>
In Codebehind :
public OverLay()
{
InitializeComponent();
this.LayoutRoot.Height = Application.Current.Host.Content.ActualHeight;
this.LayoutRoot.Width = Application.Current.Host.Content.ActualWidth;
SystemTray.IsVisible = false;
}
In the page where you would show the overlay, create an instance of popup just like this:
private Popup popup;
Initialize it after InitializeComponent(),like this :
this.popup = new Popup();
on the event where you need the overlay to show up, try like this :
this.LayoutRoot.Opacity = 0.2;
OverLay _ovr = new OverLay();
this.popup.Child = _ovr;
this.popup.IsOpen = true;
BackgroundWorker _worker = new BackgroundWorker();
_worker.DoWork += (s, a) =>
{
//you can do your work here.
Thread.Sleep(3000);
};
_worker.RunWorkerCompleted += (s, a) =>
{
popup.IsOpen = false;
this.LayoutRoot.Opacity = 1.0;
};
_worker.RunWorkerAsync();
Find the working Here on Nokia Developers community

UserControl with changing content template for displaying content

I have a situation in which i need to create a user control that hosts a content presenter. Now, the content presenter should be using the template to display data.
I have designed a user control as follows. xaml
<UserControl x:Class="Dashboard.ComponentStatisticsControl"
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"
Name="SatisticsControl"
mc:Ignorable="d"
d:DesignHeight="300" d:DesignWidth="300">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Label Content="{Binding ElementName=SatisticsControl, Path=Title}"
Grid.Row="0"
Background="SkyBlue"/>
<ContentPresenter Content="{Binding ElementName=SatisticsControl, Path=AdditionalContent}"
Grid.Row="1"/>
</Grid>
</UserControl>
Now i have a WrapPanel defined in my MainWindow.xaml that should host the ComponentStatisticsControl
<Window x:Class="Dashboard.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:Dashboard"
Height="350" Width="525"
ShowInTaskbar="True"
WindowState="Maximized"
WindowStyle="None"
Name="_this">
<Window.Resources>
<LinearGradientBrush x:Key="PanelBackground"
StartPoint="0, 1"
EndPoint="1, 0">
<GradientStop Color="SkyBlue" Offset="0.3"/>
<GradientStop Color="PaleGreen" Offset="1"/>
</LinearGradientBrush>
<SolidColorBrush x:Key="BorderBrush"
Color="Blue"/>
</Window.Resources>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<StackPanel Grid.Row="0">
<Button Click="Button_Click"
HorizontalAlignment="Left"
VerticalAlignment="Center">Click</Button>
</StackPanel>
<WrapPanel Name="WrapPanelMain"
Orientation="Horizontal"
FlowDirection="LeftToRight"
Grid.Row="1">
</WrapPanel>
</Grid>
</Window>
Now i am creating the content for the ComponentStatisticsControl in code behind.
public void CreateComponent(ref DiscoveryMessage Message)
{
switch (Message.Identifier)
{
case ComponentIdentifier.Dispatcher:
{
ComponentStatisticsControl StatisticsControl = new ComponentStatisticsControl();
StatisticsControl.Title = "Dispatcher";
StatisticsControl.AdditionalContent = new Label() { Content = "Hello"};
WrapPanelMain.Children.Add(StatisticsControl);
break;
}
}
}
However, i can not see the data added. What did i miss out. I have spent much time banging about what went wrong.
I should be able to see the content set for the label "Hello" in the WrapPanel.
public class DispatcherStatistics
{
private uint f_QCount;
public uint QueueCount { get { return f_QCount; }
set
{
f_QCount = value;
}
}
}
I will be setting this class instance to the AdditionalContent. So that QueueCount will be updated whenever i assign a new instance of this class.
Thanks in advance
EDIT
I was getting the text of my class type in the wrap panel. Now the above problem is solved, but how can i define a template for the content to show.
public void CreateComponent(ref DiscoveryMessage Message)
{
1switch (Message.Identifier)
{
case ComponentIdentifier.Dispatcher:
{
ComponentStatisticsControl StatisticsControl = new ComponentStatisticsControl();
StatisticsControl.Title = "Dispatcher";
StatisticsControl.AdditionalContent = f_clDispatcherStatistics;
WrapPanelMain.Children.Add(StatisticsControl);
break;
}
}
}
f_clDispatcherStatistics is a private instance variable for DispatcherStatistics class
This is displaying "Dashboard.DispatcherStatistics"
I want to display something like
QueueCount : 0
like this format.
You are doing it a little complicated. You can use the Content property of UserControl directly.
Here is the important part of the template (using the default ContentPresenter):
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Label Content="{Binding ElementName=SatisticsControl, Path=Title}"
Grid.Row="0"
Background="SkyBlue"/>
<ContentPresenter Grid.Row="1"/>
</Grid>
And then use the Content property directly:
ComponentStatisticsControl StatisticsControl = new ComponentStatisticsControl();
StatisticsControl.Title = "Dispatcher";
StatisticsControl.Content = new Label() { Content = "Hello"};
WrapPanelMain.Children.Add(StatisticsControl);

Categories

Resources