I have just started learning windows app development. Like what do we call it (A dialog box, Contentdialogbox, Message Dialog)? Thanks in advance.
Okay I tried this since I have my data in a datatemplate inside a contentpresenter(Making a master detail view) now when user clicks on a icon the popup should open and also display the data related to that event selected inside that list.How do I achieve this since the popup dialog control is defined inside a datatemplate so in my cs file it does not recognize the control so I am not able to open the popup dialog.
Xaml Code:
<DataTemplate x:Key="DetailContentTemplate" x:DataType="data:Event">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="200" />
<RowDefinition Height="50" />
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid x:Name="Section2" Grid.Row="0">
<Grid.Background>
<ImageBrush ImageSource="ms-appx:///Assets/8.JPG" Stretch="Fill" />
</Grid.Background>
<TextBlock MaxWidth="250"
Margin="36,62,34,68"
FontFamily="Baskerville Old Face"
FontSize="30"
Foreground="{ThemeResource ToggleButtonPressedForegroundThemeBrush}"
TextWrapping="WrapWholeWords"
d:LayoutOverrides="Width, LeftPosition, RightPosition, TopPosition, BottomPosition">
<Run Text="Gravitas Premier League" />
</TextBlock>
</Grid>
<Grid x:Name="Content"
Grid.Row="1"
Margin="0,10,0,0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<StackPanel Grid.Column="0">
<RelativePanel>
<SymbolIcon x:Name="symbol"
Margin="0,0,5,0"
HorizontalAlignment="Left"
RelativePanel.AlignLeftWithPanel="True"
Symbol="Globe" />
<TextBlock HorizontalAlignment="Right"
VerticalAlignment="Top"
RelativePanel.RightOf="symbol"
Style="{ThemeResource BaseTextBlockStyle}"
Text="Category" />
</RelativePanel>
</StackPanel>
<StackPanel Grid.Column="1" HorizontalAlignment="Center">
<RelativePanel>
<SymbolIcon x:Name="symboll"
Margin="0,0,5,0"
HorizontalAlignment="Left"
RelativePanel.AlignLeftWithPanel="True"
Symbol="People" />
<TextBlock HorizontalAlignment="Right"
VerticalAlignment="Top"
RelativePanel.RightOf="symboll"
Style="{ThemeResource BaseTextBlockStyle}"
Text="SubCategory" />
</RelativePanel>
</StackPanel>
<StackPanel Grid.Column="2" HorizontalAlignment="Right">
<RelativePanel>
<SymbolIcon x:Name="symbllol"
Margin="0,0,5,0"
HorizontalAlignment="Left"
RelativePanel.AlignLeftWithPanel="True"
Symbol="Bullets" />
<TextBlock HorizontalAlignment="Right"
VerticalAlignment="Top"
RelativePanel.RightOf="symbllol"
Style="{ThemeResource BaseTextBlockStyle}"
Text="Rupee" />
</RelativePanel>
</StackPanel>
</Grid>
<TextBlock Grid.Row="2"
HorizontalAlignment="Center"
Style="{ThemeResource ScenarioDescriptionTextStyle}"
Text="{x:Bind description}"
TextWrapping="WrapWholeWords" />
<Grid Grid.Row="3">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<SymbolIcon Grid.Column="0"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Symbol="Phone" />
<SymbolIcon Grid.Column="1"
x:Name="People"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Symbol="People"
IsTapEnabled="True"
Tapped="ShowPopupOffsetClicked"
/>
<SymbolIcon Grid.Column="2"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Symbol="Mail" />
</Grid>
</Grid>
</DataTemplate>
Now how do I open up the popup when the user taps the symbol with the name People and with necessary bindings of data with a observablecollection say EventList.
There are a lot of ways to implement the UI like in your screenshot. As you've added template10 in your question, I suppose you are using Template10 in your project. And in Template10, we can use ModalDialog to implement this. Here I use a Minimal Template 10 project for example.
Firstly, we may need to change ModalBackground to make the background color looks like what in your screenshot. As the ModalDialog we used here is the root frame created by Bootstrapper automatically, so we need override CreateRootElement in App.xaml.cs like:
public override UIElement CreateRootElement(IActivatedEventArgs e)
{
var b = Current;
var frame = new Windows.UI.Xaml.Controls.Frame();
var nav = b.NavigationServiceFactory(BackButton.Attach, ExistingContent.Include, frame);
//change background
var background = new Windows.UI.Xaml.Media.SolidColorBrush(Windows.UI.Colors.Gray);
background.Opacity = 0.2;
return new Template10.Controls.ModalDialog
{
ModalBackground = background,
DisableBackButtonWhenModal = true,
Content = nav.Frame
};
}
Then we can edit Busy.xaml to implement the panel in your screenshot. In Busy.xaml, it's a UserControl used as the ModalContent of ModalDialog. For example,
<UserControl x:Class="T10Minimal.Views.Busy"
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:local="using:T10Minimal.Views"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
d:DesignHeight="300"
d:DesignWidth="400"
mc:Ignorable="d">
<Grid Width="300"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Background="White"
CornerRadius="10">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
...
</Grid.RowDefinitions>
<TextBlock Margin="20,0"
VerticalAlignment="Center"
FontSize="24"
Foreground="Black">
Song Options
</TextBlock>
<Button Margin="12"
HorizontalAlignment="Right"
VerticalAlignment="Top"
Click="CloseClicked"
Foreground="Black"
Style="{StaticResource TextBlockButtonStyle}">
<SymbolIcon Symbol="Clear" />
</Button>
...
</Grid>
</UserControl>
The bindings might like the BusyText in the original control, you can change its type to your binding data's type and also change the SetBusy method. After this, you can call SetBusy method in your ShowPopupOffsetClicked method to open the "popup".
This is just a simple sample, you can refer to it to implement your own. And in the sample, I used the ModalDialog created as the root frame of the application. If you need more than one ModalDialog, you can refer to Search (and Login) Sample on GitHub.
Related
In the textboxes from the code below, the blinking cursor doesn't show even after i click the textbox or when it has focus.I'm posting this big a code because i think perhaps it's the parent element properties that are somehow interfering with the texboxes but I can't seem to find a solution for this. Can someone please help.
<Canvas Name="encounterTab" Style="{StaticResource canvasRecording}" Visibility="Hidden" Width="{DynamicResource {x:Static SystemParameters.FullPrimaryScreenWidthKey}}" FocusManager.IsFocusScope="True">
<Grid Height="{DynamicResource {x:Static SystemParameters.FullPrimaryScreenHeightKey}}" Width="{DynamicResource {x:Static SystemParameters.FullPrimaryScreenWidthKey}}" Margin="0,0,0,0" FocusManager.IsFocusScope="True">
<DockPanel Style="{StaticResource screenTitleDock}" Grid.Row="0" VerticalAlignment="Top" >
<TextBlock Name="textBlock1" Style="{StaticResource screenTitle}">ENCOUNTER DETAILS</TextBlock>
</DockPanel>
<Grid Style="{StaticResource gridRecording}" SizeChanged="MainGrid_SizeChanged" Name="gridEncDetails" FocusManager.IsFocusScope="True">
<Grid.LayoutTransform>
<ScaleTransform
CenterX="0"
CenterY="0"
ScaleX="{Binding ElementName=myMainWindow, Path=ScaleValue}"
ScaleY="{Binding ElementName=myMainWindow, Path=ScaleValue}" />
</Grid.LayoutTransform>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="188*"></ColumnDefinition>
<ColumnDefinition Width="149*"></ColumnDefinition>
<ColumnDefinition Width="63*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition ></RowDefinition>
<RowDefinition ></RowDefinition>
<RowDefinition ></RowDefinition>
<RowDefinition ></RowDefinition>
<RowDefinition></RowDefinition>
</Grid.RowDefinitions>
<Label x:Name="lblApptTime" Content="Time:" Grid.Column="0" Grid.Row="0" />
<TextBox x:Name="txtTime" GotKeyboardFocus="txtApptTimeKeyBoadFocus" GotMouseCapture="txtApptTime_MouseClick" Grid.Column="1" Grid.Row="0" Width="149" LostFocus="txtApptTime_LostFocus" HorizontalAlignment="Left" MouseDoubleClick="txtApptTime_MouseDoubleClick" Margin="0,11" Height="38" GotTouchCapture="txtApptTime_GotTouchCapture" />
<ComboBox x:Name="ddlAmPm" VerticalContentAlignment="Center" Grid.Row="0" Grid.Column="2" Width="55" IsSynchronizedWithCurrentItem="True" Margin="0,10" HorizontalAlignment="Right" Height="38">
<ComboBoxItem>AM</ComboBoxItem>
<ComboBoxItem>PM</ComboBoxItem>
<ComboBox.ItemTemplate>
<DataTemplate>
<Grid >
<TextBlock Height="Auto"
HorizontalAlignment="Stretch"
VerticalAlignment="Center" />
</Grid>
</DataTemplate>
</ComboBox.ItemTemplate>
</ComboBox>
<Label x:Name="lblNo" Content="No:" Grid.Column="0" Grid.Row="1" Margin="0,11" Height="38" />
<TextBox x:Name="txtEncounterNumber" Grid.Column="1" Grid.Row="1" KeyDown="txtEncounterNumber_KeyUp" TextChanged="txtEncounterNumber_TextChanged" HorizontalAlignment="Left" Width="212" Margin="0,10" Grid.ColumnSpan="2" Height="Auto" />
<Button x:Name="btnNext1" Grid.Row="2" Grid.ColumnSpan="3" Style="{StaticResource btnRec}" Click="btnNext1_Click" TouchUp="btnTouchNext1_Click" Margin="50,20,50,10" >
<Image Source="Assets/btnNext.png" Stretch="Fill" HorizontalAlignment="Center" VerticalAlignment="Center"/>
</Button>
</Grid>
</Grid>
</Canvas >
Note:- When i start typing the caret appears but disappears when i clear the textbox values.
It looks like you problem might comes from the ScaleTransform. If a TextBox is scaled to less then it's original size it's cursor disappears. This happens because the TextBox caret is with Width of 1 and when scaled down it becomes less then 1. So it's not visualized at all.
As a workaround make the minimal possible size as default so UI is only scaled up.
Another workaround it to create a custom caret like it's shown here WPF TextBox Inside ViewBox loses Cursor on resize
How do I implement a persistent navigation bar. Basically an app bar that cannot be dismissed even by the right click action. MS as referred to this in this article ( https://msdn.microsoft.com/en-us/library/windows/apps/xaml/dn440584.aspx ) when discussing the flat navigation in the calculator app and also here ( http://blogs.windows.com/bloggingwindows/2014/05/13/windows-store-refresh-makes-it-easier-to-find-apps/ ) when reviewing changes to the windows store app in windows 8.1.
Here's how you do it.
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<StackPanel Grid.Row="0" x:Name="NavigationPart" Orientation="Horizontal">
<Button Content="Home" />
<Button Content="Products" />
<Button Content="Contact" />
</StackPanel>
<Frame Grid.Row="1" x:Name="ContentPart" />
</Grid>
Best of luck!
After reading your question i started googling and was not able to find any already available app bars for that. So as far as i know there is nothing like persistent App Bar. IsSticky property does help to some extent but still can be dismissed by right click.
But still you can customize things by yourself...
As for eg. you have referred this page in your question.
You can make your own implementation for the same.
This is my implementation just to get you started...
<Page
x:Class="App2.BlankPage5"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:App2"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d">
<Grid Background="White">
<Grid.RowDefinitions>
<RowDefinition Height="80"/>
<RowDefinition Height="120"/>
<RowDefinition />
</Grid.RowDefinitions>
<Grid Grid.Row="0" Background="Green">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition />
<ColumnDefinition />
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<StackPanel Grid.Column="0" Orientation="Horizontal">
<Rectangle Width="80" Height="80">
<Rectangle.Fill>
<ImageBrush ImageSource="Assets/windows-image.jpg" />
</Rectangle.Fill>
</Rectangle>
<TextBlock Text="Home" FontSize="40" VerticalAlignment="Center" HorizontalAlignment="Center"/>
</StackPanel>
<TextBlock Text="Top Charts" Grid.Column="1" FontSize="40" VerticalAlignment="Center" HorizontalAlignment="Center"/>
<TextBlock Text="Categories" Grid.Column="2" FontSize="40" VerticalAlignment="Center" HorizontalAlignment="Center"/>
<TextBlock Text="Collection" Grid.Column="3" FontSize="40" VerticalAlignment="Center" HorizontalAlignment="Center"/>
<TextBlock Text="Accounts" Grid.Column="4" FontSize="40" VerticalAlignment="Center" HorizontalAlignment="Center"/>
</Grid>
<Grid Grid.Row="1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="100" />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Rectangle Grid.Column="0" Width="110" Height="110">
<Rectangle.Fill>
<ImageBrush ImageSource="Assets/back.png" />
</Rectangle.Fill>
</Rectangle>
<TextBlock Margin="10, 0, 0, 0" Text="Store" FontSize="70" Grid.Column="1" Foreground="Black" HorizontalAlignment="Left" VerticalAlignment="Center"/>
</Grid>
<Grid Grid.Row="2" >
<TextBlock Text="Your Content Here" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="100" Foreground="Black"/>
</Grid>
</Grid>
</Page>
It produces the following output :
I have not worked on the respective event handlers and i hope you can do that according to your needs.
A Basic Advice : Don't try to make too many changes to the already available design templates. Stick to them and only apply the required changes.
I have a .NET 4.0 WPF application using the MVVM pattern and I've been unable to achieve the desired outcome on one of the screens (UserControl as View). I have stripped down most of the page to show the core of the problem. The page consists of a grid with three rows and one column. The first row contains header text and the last row contains a Save button. The middle row contains a grid with one row and column and displays an ObservableCollection in an ItemsControl with a data template of a custom user control. There are ten items in the collection and I want them to display in two columns and five rows so I have a WrapPanel as an ItemsPanelTemplate.
I want the ItemsControl to scroll within the available space but it is expanding to the size of content and most of it is being cropped off the bottom of the page.
I am listing the XAML for user control the ObservableCollection uses as a data template and the XAML for the main page below that. Any help is greatly appreciated.
<UserControl x:Class="OIL.UserControls.ShopNotes.ShopNoteComponent"
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="120" d:DesignWidth="150">
<Grid>
<Grid.RowDefinitions>
<RowDefinition />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Border Grid.Row="0" Grid.Column="0" Width="140" Margin="5,5,5,5" HorizontalAlignment="Center" VerticalAlignment="Top" BorderBrush="Black" BorderThickness="1" CornerRadius="5">
<StackPanel Width="120" Margin="0,5,0,5" HorizontalAlignment="Center" VerticalAlignment="Top" Orientation="Vertical">
<Image Height="25" Width="30" HorizontalAlignment="Left" Source="/OIL;component/Images/BlueCam.png">
<Image.ToolTip>
<Image Source="{Binding Path=ToolTipImagePath}" />
</Image.ToolTip>
</Image>
<Label Style="{DynamicResource LargeText}" Content="{Binding Path=ComponentTitle}" />
<CheckBox Width="80" Margin="0,5,0,5" HorizontalAlignment="Left" Style="{DynamicResource NormalText}" Content=" Mandatory?"
IsChecked="{Binding Path=ComponentMandatory, Mode=TwoWay}"
IsEnabled="{Binding Path=ComponentSelected}" />
<CheckBox Width="15" Margin="0,5,0,5" HorizontalAlignment="Center"
IsChecked="{Binding Path=ComponentSelected, Mode=TwoWay}" />
</StackPanel>
</Border>
</Grid>
And here is the main XAML page:
<UserControl x:Class="OIL.View.ConfiguratorViews.Configurator_ShopNotes_Tab"
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:igWPF="http://infragistics.com/Editors"
xmlns:uc="clr-namespace:OIL.UserControls.ShopNotes"
mc:Ignorable="d"
d:DesignHeight="570" d:DesignWidth="866">
<UserControl.Resources>
<BooleanToVisibilityConverter x:Key="BooleanToVisibilityConverter" />
<DataTemplate x:Key="ShopNotesComponentsTemplate">
<uc:ShopNoteComponent />
</DataTemplate>
</UserControl.Resources>
<Border Margin="10" CornerRadius="13" BorderThickness="3" BorderBrush="#FF666666">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="40" />
<RowDefinition Height="*" />
<RowDefinition Height="50" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<StackPanel Grid.Row="0" Grid.Column="0" Orientation="Horizontal">
<Button Height="30" Width="75" Margin="10,5,0,5" HorizontalAlignment="Center" VerticalAlignment="Center" Background="{x:Null}"
Command="{Binding Path=AddNewTemplateCommand}"
Content="Add" />
<Button Height="30" Width="75" Margin="10,5,0,5" HorizontalAlignment="Center" VerticalAlignment="Center" Background="{x:Null}"
Command="{Binding Path=EditTemplateCommand}"
Content="Edit" />
<Grid Margin="10,5,0,5">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<StackPanel Grid.Row="0" Grid.Column="0" Orientation="Horizontal" Visibility="{Binding Path=IsNewTemplate, Converter={StaticResource BooleanToVisibilityConverter}}">
<TextBox Height="30" Width="250" HorizontalAlignment="Left" VerticalAlignment="Center" Style="{DynamicResource NormalText}" Text="{Binding Path=TemplateDescription}" />
</StackPanel>
<StackPanel Grid.Row="0" Grid.Column="0" Orientation="Horizontal" Visibility="{Binding Path=IsEditedTemplate, Converter={StaticResource BooleanToVisibilityConverter}}">
<igWPF:XamComboEditor Name="cmbShopNotesTemplate" Height="30" HorizontalAlignment="Left" VerticalAlignment="Center"
ItemsSource="{Binding Path=ShopNoteTemplates, Mode=TwoWay}"
DisplayMemberPath="CONFIGURATION_DESC"
SelectedItem="{Binding Path=SelectedShopNoteTemplate, ValidatesOnDataErrors=True}"
Value="Select Shop Notes Template"
NullText="Select Shop Notes Template"
IsEditable="True">
</igWPF:XamComboEditor>
</StackPanel>
</Grid>
</StackPanel>
<Grid Grid.Row="1" Grid.Column="0">
<Grid.RowDefinitions>
<RowDefinition Height="40" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Label Grid.Row="0" Grid.Column="0" Height="30" Margin="0,5,0,5" HorizontalAlignment="Center" VerticalAlignment="Center" Style="{DynamicResource NormalText}" Content="* Hover over camera icon to view Shop Note component" />
<ItemsControl Grid.Row="1" Grid.Column="0" HorizontalAlignment="Left"
ItemsSource="{Binding Path=ShopNoteComponents, UpdateSourceTrigger=PropertyChanged, Mode=TwoWay}"
ItemTemplate="{StaticResource ShopNotesComponentsTemplate}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel Width="300" />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
</ItemsControl>
</Grid>
<Button Grid.Row="2" Grid.Column="0" Height="30" Width="150" Margin="10,10,0,10" HorizontalAlignment="Left" VerticalAlignment="Center"
Background="{x:Null}"
Command="{Binding Path=SaveTemplateCommand}"
Content="Save" />
</Grid>
</Border>
EDIT: Changed question title as I have removed the ScrollViewer between starting the question and actually posting it. Also, noticed the Save button was in the inner grid rather than outer grid so I have corrected that (no change in rendering).
An ItemsControl does not have its own ScrollViewer like a ListBox. You can either replace you ItemsControl with a ListBox, or simply wrap it in a ScrollViwer, being careful to move the Grid.Row and Grid.Column settings like this:
<ScrollViewer Grid.Row="1" Grid.Column="0">
<ItemsControl HorizontalAlignment="Left" ItemsSource="{Binding Path=Items,
UpdateSourceTrigger=PropertyChanged, Mode=TwoWay}"
ItemTemplate="{StaticResource ShopNotesComponentsTemplate}">
<ItemsControl.ItemsPanel>
<ItemsPanelTemplate>
<WrapPanel Width="300" />
</ItemsPanelTemplate>
</ItemsControl.ItemsPanel>
</ItemsControl>
</ScrollViewer>
I have this DataTemplate in my ListBox:
<local:SearchTemplateSelector.VideoTemplate>
<DataTemplate>
<Grid>
<Rectangle Height="1" HorizontalAlignment="Stretch" VerticalAlignment="Top" Fill="Black" Opacity="0.3" />
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="100" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Image Margin="0" HorizontalAlignment="Left" Source="{Binding Path=ImgUrl}" Width="100" Height="100" />
<Grid Grid.Column="1" Margin="10,0,8,0">
<Grid.RowDefinitions>
<RowDefinition Height="60"/>
<RowDefinition Height="*"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<TextBlock Text="{Binding Name}" FontSize="20" Foreground="Black" TextWrapping="Wrap" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />
<StackPanel Orientation="Horizontal" Margin="0,-5,0,0" Grid.Row="1">
<TextBlock Text="Views: " FontSize="20" Foreground="Black"/>
<TextBlock Text="{Binding ViewCount}" FontSize="20" Foreground="Black"/>
</StackPanel>
<TextBlock Text="{Binding TimeStr}" FontSize="20" Foreground="Black" Grid.Row="2" Margin="0,0,0,0" />
</Grid>
</Grid>
</Grid>
</DataTemplate>
</local:SearchTemplateSelector.VideoTemplate>
Now i have Image that i binding from ImgUrl of my object.And i want to know if there is possibility to make something like this:
If the image is in the device take it from the device,if not download it and save it on the device for next time, every image have a unique id so i can just save it with id.png
If I understand you correct, you have to add logic to ImgUrl property. You have to add some method in Set{}, which will try load image from isolatedStorage, and catch exception, in which it will use method to load and save image to isolatedStorage.
I am playing around with WPF for the first time and i am tring to show / hide group objects on a test toolbar based on a toggle button.
The toolbar is created via a template in a resource dictionary and i cannot figure out how to get this working as it seems alot more of an issue compared to winforms.
Out of all the examples i have found they all seem to function if the item is not templated is there any way i can acheive this.
my code so far is below and the point of failure is on the login togglebutton as i have x:name reference and apparently i cannot do this as its part of a resource dictionary, so i am pretty stumped...
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:s="clr-namespace:wpfApplication1">
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="pack://application:,,,/wpfApplication1;component/Resources/Styles/Shared.xaml"/>
<ResourceDictionary Source="pack://application:,,,/wpfApplication1;component/Resources/Styles/ToolBar.xaml"/>
</ResourceDictionary.MergedDictionaries>
<ToolBar x:Key="MyToolbar" Height="120">
<ToolBar.Resources>
<BooleanToVisibilityConverter x:Key="boolToVis"/>
</ToolBar.Resources>
<GroupBox x:Name="tBtn" Header="Login" Style="{StaticResource ToolbarGroup}" Margin="5,3,3,3">
<StackPanel Grid.Row="1" Orientation="Horizontal">
<!--Login-->
<ToggleButton Margin="3" Width="55" Style="{StaticResource ToolBarButtonBaseStyle}"
HorizontalContentAlignment="Center""
CommandTarget="{Binding ElementName=MyTestApp}">
<ToggleButton.Content>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="4*"/>
<RowDefinition Height="1*"/>
</Grid.RowDefinitions>
<Image Source="pack://application:,,,/wpfApplication1;component/Resources/Images/Login.png" Width="45"/>
<TextBlock Grid.Row="1" Text="New" VerticalAlignment="Bottom" HorizontalAlignment="Center"/>
</Grid>
</ToggleButton.Content>
</ToggleButton>
</StackPanel>
</GroupBox>
<GroupBox Visibility="{Binding Path=IsChecked, ElementName=tBtn, Converter={StaticResource boolToVis}}" Header="File" Style="{StaticResource ToolbarGroup}" Margin="5,3,3,3">
<StackPanel Grid.Row="1" Orientation="Horizontal">
<!--File-->
<Button Margin="3" Width="55" Style="{StaticResource ToolBarButtonBaseStyle}"
HorizontalContentAlignment="Center"
Command="{x:Static ApplicationCommands.New}"
CommandTarget="{Binding ElementName=MyTestApp}">
<Button.Content>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="4*"/>
<RowDefinition Height="1*"/>
</Grid.RowDefinitions>
<Image Source="pack://application:,,,/wpfApplication1;component/Resources/Images/GenericDocument.png" Width="45"/>
<TextBlock Grid.Row="1" Text="New" VerticalAlignment="Bottom" HorizontalAlignment="Center"/>
</Grid>
</Button.Content>
</Button>
<StackPanel Orientation="Vertical" Margin="0,2,0,2">
<Button Margin="1" Padding="2" HorizontalContentAlignment="Left"
Style="{StaticResource ToolBarButtonBaseStyle}"
Command="{x:Static ApplicationCommands.Open}"
CommandTarget="{Binding ElementName=MyTestApp}">
<Button.Content>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Image Source="pack://application:,,,/wpfApplication1;component/Resources/Images/OpenFolder.png" Width="16"/>
<TextBlock Margin="3,0,3,0" Text="Open" VerticalAlignment="Center" Grid.Column="1"/>
</Grid>
</Button.Content>
</Button>
<Button Margin="1" Padding="2" HorizontalContentAlignment="Left"
Style="{StaticResource ToolBarButtonBaseStyle}"
Command="{x:Static ApplicationCommands.Save}"
CommandTarget="{Binding ElementName=MyTestApp}">
<Button.Content>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Image Source="pack://application:,,,/wpfApplication1;component/Resources/Images/Save.png" Width="16"/>
<TextBlock Margin="3,0,3,0" Text="Save" VerticalAlignment="Center" Grid.Column="1"/>
</Grid>
</Button.Content>
</Button>
<Button Margin="1" Padding="2" HorizontalContentAlignment="Left"
Style="{StaticResource ToolBarButtonBaseStyle}"
Command="{x:Static ApplicationCommands.Print}"
CommandTarget="{Binding ElementName=MyTestApp}">
<Button.Content>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
<ColumnDefinition />
</Grid.ColumnDefinitions>
<Image Source="pack://application:,,,/wpfApplication1;component/Resources/Images/Print.png" Width="16"/>
<TextBlock Margin="3,0,3,0" Text="Print" VerticalAlignment="Center" Grid.Column="1"/>
</Grid>
</Button.Content>
</Button>
</StackPanel>
</StackPanel>
</GroupBox>
</ToolBar>
</ResourceDictionary>
Many thanks in advance for any assistance
now your GroupBox is called "tBtn" but that should be your ToggleButton. (as you are refering to its property IsChecked)
Try to name your ToggleButton tBtn and retry