Different style of progress bar in Mahapps - wpf

I don't know why Mahapps progress bar still has the same style despite the fact that I change style in App.xaml (other controls works fine).
Is there any other way than creating from zero a style for this control?
App.xaml
<Application x:Class="WpfApp2.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:WpfApp2"
StartupUri="MainWindow.xaml">
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Controls.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Fonts.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Colors.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/Orange.xaml" />
<ResourceDictionary Source="pack://application:,,,/MahApps.Metro;component/Styles/Accents/BaseLight.xaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>
MainWindow.xaml
<Controls:MetroWindow x:Class="WpfApp2.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:Controls="clr-namespace:MahApps.Metro.Controls;assembly=MahApps.Metro"
xmlns:local="clr-namespace:WpfApp2"
mc:Ignorable="d"
Title="MainWindow" Height="600" Width="800"
Background="WhiteSmoke">
<StackPanel VerticalAlignment="Center">
<Grid Margin="10">
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="200*"/>
</Grid.RowDefinitions>
<Controls:Tile Grid.Column="0" Grid.Row="0" Width="200" Height="200"/>
<Controls:Tile Grid.Column="1" Grid.Row="0" Width="200" Height="200"/>
<Controls:Tile Grid.Column="2" Grid.Row="0" Width="200" Height="200"/>
</Grid>
<Controls:MetroProgressBar Value="50" />
</StackPanel>

Related

cant add click event to button in wpf

So I am following a tutorial and I have to add a click event to a button, like I've done many time before. For some reason it give me the following error: Ensure Event Failed.
I did see some questions on the internet that I have to declare a x:Class, but I have done that. It may be incorrect, but I don't know. Below is my XAML code.
<Window x:Class="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:img_tutorial"
mc:Ignorable="d"
Title="MainWindow" Height="450" Width="800">
<Grid ShowGridLines="true" x:Name="theGrid">
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
<Image HorizontalAlignment="Left" Height="211" VerticalAlignment="Top" Width="387" Source="acces.png" Stretch="UniformToFill"/>
<StackPanel>
<TextBox x:Name="txtImage"></TextBox>
<Button Click="">Add Image</Button>
</StackPanel>
</Grid>
</Window>
I figured it out! The mistake wasn't in my XAML code but in my Visual Basic. For some reason I cannot explain it set the Class as MainWindow3. I changed it to MainWindow and that allowed me to add my event.

My WPF UI disappears when I set a style for Grid in App.xaml

I have a window with a grid containing an image and some buttons:
<Window x:Class="Wormholes.Views.TitleWindow"
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:Wormholes"
xmlns:commands="clr-namespace:Wormholes.Commands"
mc:Ignorable="d"
Title="Warning: Weird Wormholes!" Height="450" Width="800" WindowState="Maximized" WindowStyle="None">xi
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="64"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Image Source="/Images/Splash.png" Grid.RowSpan="2" Grid.ColumnSpan="3"/>
<Button Grid.Row="1" Grid.Column="0" Command="commands:Commands.StartCommand">Start</Button>
<Button Grid.Row="1" Grid.Column="2" Command="commands:Commands.ExitCommand">Exit</Button>
</Grid>
</Window>
And a style in App.xaml:
<Application x:Class="Wormholes.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:Wormholes"
StartupUri="Views/TitleWindow.xaml">
<Application.Resources>
<Style TargetType="{x:Type Grid}">
<Setter Property="Background" Value="Black"/>
</Style>
</Application.Resources>
</Application>
However when this style exists in App.xaml, then when I run my app, the image and buttons disappear as soon as the window opens! If I delete the style, the controls appear (unstyled of course). and if I put the style in Window.Resources, it works, but of course then it wouldn't apply to any other views I created. How can I make the style work from App.xaml?
Do you want to be applied to all your Grid controls ? If so, just modify your App.Xaml to this so you override the previous Grid style:
<Application x:Class="Wormholes.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:Wormholes"
StartupUri="Views/TitleWindow.xaml">
<Application.Resources>
<Style TargetType="{x:Type Grid}" **BasedOn="{StaticResource {x:Type Grid}}"**>
<Setter Property="Background" Value="Black"/>
</Style>
</Application.Resources>
If it's just for a few Grid controls modify your App.xaml to this:
<Application x:Class="Wormholes.App"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="clr-namespace:Wormholes"
StartupUri="Views/TitleWindow.xaml">
<Application.Resources>
<Style x:Key="YourGridStyleKey" TargetType="Grid">
<Setter Property="Background" Value="Black"/>
</Style>
</Application.Resources>
And then in your View:
<Window x:Class="Wormholes.Views.TitleWindow"
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:Wormholes"
xmlns:commands="clr-namespace:Wormholes.Commands"
mc:Ignorable="d"
Title="Warning: Weird Wormholes!" Height="450" Width="800" WindowState="Maximized" WindowStyle="None">xi
<Grid Style="{StaticResource YourGridStyleKey}">
<Grid.RowDefinitions>
<RowDefinition Height="*"/>
<RowDefinition Height="64"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Image Source="/Images/Splash.png" Grid.RowSpan="2" Grid.ColumnSpan="3"/>
<Button Grid.Row="1" Grid.Column="0" Command="commands:Commands.StartCommand">Start</Button>
<Button Grid.Row="1" Grid.Column="2" Command="commands:Commands.ExitCommand">Exit</Button>
</Grid>

Can't set ItemTemplate to ListView because it doesn't find the resource

This is my ListDictionary.xaml
<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Seminarska">
<DataTemplate x:Name="ArticleListTemplate">
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding Title}"
Margin="5"
Style="{StaticResource BodyTextBlockStyle}" />
</StackPanel>
</DataTemplate>
</ResourceDictionary>
And my MainPage.xaml
<Page
x:Class="Seminarska.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:Seminarska"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid.RowDefinitions>
<RowDefinition Height="80" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<ProgressRing HorizontalAlignment="Center"
VerticalAlignment="Center"
Visibility="Collapsed"
Height="100"
Width="100"
x:Name="pbLoading"
Grid.RowSpan="3" />
<TextBlock Style="{StaticResource HeaderTextBlockStyle}"
Grid.Row="0"
Margin="10,0,0,0"
Text="My articles"
VerticalAlignment="Center"
HorizontalAlignment="Center" />
<ListView x:Name="lvData"
Grid.Row="1"
SelectionChanged="LvData_OnSelectionChanged"
ItemTemplate="{StaticResource ArticleListTemplate}"
VerticalAlignment="Stretch"
HorizontalAlignment="Left"/>
</Grid>
</Page>
As you can see I am trying to set ItemTemplate to ListView but it doesn't find it. It says:
The resource 'ArticleListTemplate' could not be resolved.
Assuming that you did not do that in application resources for example in order to access resources from dictionary file you need to use it first
<Page>
<Page.Resources>
<ResourceDictionary >
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="/path/to/file/ListDictionary.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Page.Resources>
<!-- -->
</Page>
and for DataTemplate you need to use x:Key instead of x:Name
<DataTemplate x:Key="ArticleListTemplate">

How to re-use grid definitions from ResourceDictionary?

I'm trying to re-use a Grid which is defined under ResourceDictionary(guiLayout.xaml)
guiLayout.xaml
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Grid x:Key="guiLayout">
<Grid.RowDefinitions>
<RowDefinition Height="10"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
</Grid>
and also I have MainWindow.xaml,
<Window x:Class="WpfApplication3.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>
<!-- I want to use ResourceDictionary definitions here-->
</Grid>
Is it possible to use the Grid definition from guiLayout.xml in Mainwindow.xaml?
Edit:
The project looks like this,
You can set the Content of the Window in XAML like this:
<Window x:Class="WpfApplication3.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"
Content="{StaticResource guiLayout}">
</Window>
Or using element syntax:
<Window x:Class="WpfApplication3.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">
<Window.Content>
<StaticResource ResourceKey="guiLayout"/>
</Window.Content>
</Window>
Note that without using x:Shared for the Grid saved as Resource, that Grid is usable only for 1 window. To use it for multiple windows, you have to add x:Shared="false" for the Grid like this:
<Grid x:Key="guiLayout" x:Shared="false">
<!-- ... -->
</Grid>
Update: Try this code to import the resources:
In App.xaml:
<Application.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="Resources\guiLayout.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>

Silverlight reference XAML from code

In Silverlight5, how to reference a user control resource - emoticon from a button_click event?
I can access the object fine if I build it up in code behind then do the databinding that way, however using the XAML approach I get some nicer tooling. Example comes from Ch16
private void Button_Click_1(object sender, RoutedEventArgs e)
{
// **HERE how do I reference the XAML emoticon object
//emoticon.Name = "Smiley face2";
//emoticon.Icon = new BitmapImage(new Uri("icons/happy.png", UriKind.RelativeOrAbsolute));
}
.
<UserControl x:Class="EmoticonExample.MainPage"
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:EmoticonExample"
mc:Ignorable="d"
d:DesignHeight="300"
d:DesignWidth="400">
<UserControl.Resources>
<local:Emoticon x:Key="emoticon"
Name="SmileyFace"
Icon="icons/happy.png" />
</UserControl.Resources>
<Grid x:Name="LayoutRoot"
Margin="10"
Background="White"
DataContext="{StaticResource emoticon}">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<TextBlock Text="Name:" />
<TextBlock Text="Image:" Grid.Column="1" />
<TextBox Name="myTextBox" Text="{Binding Name, Mode=TwoWay}" Grid.Row="1" />
<Image Name="myImage" Source="{Binding Icon}" Stretch="None" Grid.Row="1" Grid.Column="1" />
<Button Content="Button" HorizontalAlignment="Left" Margin="10,116,0,-92" Grid.Row="1" VerticalAlignment="Top" Width="75" Click="Button_Click_1"/>
</Grid>
</UserControl>
Name your user control
<UserControl x:Class="EmoticonExample.MainPage"
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:EmoticonExample"
mc:Ignorable="d"
x:Name="Example"
d:DesignHeight="300"
d:DesignWidth="400">
</UserControl
Then reference it in your code behind:
var emoticon = Example.Resources["emoticon"] as Emoticon; // Im not sure of your data type

Resources