XAML call TabItem Unload event programmatically - xaml

I'm quite new to XAML so I'm hoping this to be a very simple question.
My main window has a TabControl and on certain cases, I would like to call the Unload event on a certain Tab.
The MainView xaml looks like this:
<Window
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:Views="clr-namespace:NameSpace.Project1.Views" x:Class="NameSpace.Project1.Views.MainWindow"
Width="500" Height="500"
Title="Hello World">
<Grid>
<TabControl x:Name="MyTabs" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" >
<TabItem Header="Live" Name="ChildView">
<Views:ChildView HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />
</TabItem>
<TabItem Header="Playback" Name="OtherView">
<Views:OtherView HorizontalAlignment="Stretch" VerticalAlignment="Stretch" />
</TabItem>
</TabControl>
</Grid>
</Window>
QUESTION:
On Close of the Application, I'm getting an OnExit event on the App.xaml.cs code, and there I wanted to make sure the ChildView Tab calls its Unload event.
I tried to programmatically call MyTabs.SelectedItem or MyTabs.SelectedIndex or OtherTab.IsVisible = true but none fire up the Unload event of the ChildView.
If I click on the OtherView tab, that event fires.
How do I call it programmatically??
Any help is truly appreciated.

Related

ContentControl and Button Content Binding

I am new to XAML.
I have a Mainview with a Button.
This button must display a UserControl by binding the content, and in the same time, the button must disappear.
My first try :
<ContentControl Content="{Binding CurrentViewModel}"/>
<ContentControl>
<Button Command="{Binding TestCommand}">
<Grid >
<Image Source="....." />
<TextBlock Text="Text on the button"/>
</Grid>
</Button>
</ContentControl>
In this example, when I click on the button, my usercontrol is displayed but the button remains in the MainWindow which is normal.
Of course I can create a usercontrol with just the button and keep only <ContentControl Content="{Binding CurrentViewModel}"/> it will do the job, but is it possible to do it in XAML?
Something like "Display the button only if MainWindowViewModel is binded?"
Thanks.

Hyperlinks doesn't open in MarkdownTextBlock control in windows universal application

I have below code in my view (XAML)
<Page
x:Class="MyProject1.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:controls="using:Microsoft.Toolkit.Uwp.UI.Controls"
mc:Ignorable="d" Background="Black">
<Grid Background="White" Name="mainGrid">
<Border BorderBrush="Cyan" BorderThickness="0.2" Margin="3,0,3,3">
<ListView x:Name="ListView" VerticalAlignment="Bottom" SelectionMode="None" IsItemClickEnabled="True">
<ListView.ItemTemplate>
<DataTemplate>
<controls:MarkdownTextBlock Name="markdownBlock" Text="[link](www.google.com)">
</controls:MarkdownTextBlock>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</Border>
</Grid>
</Page>
I am trying to render hyperlinks in MarkdownTextBlock control, however when I click on hyperlink, there is no effect.
Same code when I run in browser, works fine.. I mean, I can click on the link and then the new tab/browser opens up for the http request.
What am i missing in my MarkdownTextBlock control in above xaml code?
Do I need to add any property for the link click to be enabled?
You need to handle the link cliecked event manually where you can launch the browser to the clicked link.
View.xaml
<controls:MarkdownTextBlock Name="markdownBlock" Text="[link](www.google.com)" LinkClicked="MarkdownText_LinkClicked">
View.xaml.cs
private async void MarkdownText_LinkClicked(object sender, UI.Controls.LinkClickedEventArgs e)
{
await Launcher.LaunchUriAsync(new Uri(e.Link));
}

Customize Windows Phone 8.1 message dialog

I want to customize my message dialog as shown in following figure
How do I perform that I have prepared xaml for this
<StackPanel Name="rootStackPanel" Height="Auto" Background="#363636" VerticalAlignment="Top">
<StackPanel Margin="10">
<StackPanel Margin="0,0,0,10" Orientation="Horizontal">
<TextBlock x:Name="HeadingText" x:FieldModifier="public" Style="{StaticResource ApplicationMessageBoxHeadingStyle}" Text="Alert" />
<Image Margin="10,05,0,0" Source="/Assets/Images/alert.png" Width="35"></Image>
</StackPanel>
<TextBlock x:FieldModifier="public" x:Name="ContentText" Style="{StaticResource ApplicationMessageBoxErrorStyle}" Text="Pease enter a valid plate number" />
<Button x:FieldModifier="public" Name="OkButton" Margin="0,20,0,0" Padding="0" HorizontalAlignment="Left" Content="Ok" Style="{StaticResource ApplicationThemeButtonStyle}"/>
</StackPanel>
</StackPanel>
The exact look you have there is non-standard, and if you want that exact thing you'll need to write some custom code. If the important part is the icon in the alert title then this is pretty easy with a ContentDialog.
The MessageDialog isn't customizable, but the ContentDialog is. There is a template to add a new ContentDialog to your project with the Add.New Item... menu.
Once you have your ContentDialog files you can customize the template to title its button "OK":
<ContentDialog
x:Class="MyApp.AlertDialog"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:MyApp"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
Title="Alert"
PrimaryButtonText="OK"
PrimaryButtonClick="ContentDialog_PrimaryButtonClick"
>
And include your alert.png along with the Title in the title template. A more advanced version would allow binding different icons for different purposes.You could also fill a path instead of drawing a png so the icon will scale more easily.
<ContentDialog.TitleTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding}" Foreground="{ThemeResource PhoneAccentBrush}"/>
<Image Source="/Assets/Images/alert.png" />
</StackPanel>
</DataTemplate>
</ContentDialog.TitleTemplate>
And then include the rest of the contents in the ContentDialog's Xaml:
<StackPanel>
<TextBlock x:FieldModifier="public" x:Name="ContentText" Style="{StaticResource ApplicationMessageBoxErrorStyle}" Text="Pease enter a valid plate number" />
</StackPanel>
This will put the OK button in its standardized location at the bottom right. If you want to include it with the text you can stick it in your StackPanel like in your sample code and not set the PrimaryButtonText on the ContentDialog.
Create a Usercontrol in the project.
Put the entire xaml code in the Usercontrol.
Now you can use this Usercontrol as a popup wherever you want to use it.
Popup msgpopup = new Popup( );
msgpopup.child = new CustomisedMessageDialogControl(); //name of ur Usercontrol
And to open this Dialog simply,
msgpopup.IsOpen = true;

I cant place or set background or border of my user control

I've created a simple user control for my xaml project, but as you can see from my image i cant seem to be able to do certain things.
Ignore the red line, its the size of the control for illustrate its size.
It's placement should be middle of the screen:
<Client:TileMenu HorizontalAlignment="Center" VerticalAlignment="Center" Name="TileOverlayMenu" Background="Azure" BorderBrush="Aquamarine" BorderThickness="3" />
And as you see its background color should be "Azure" with a blueish border of 3.
Why is this?
In the background I have a Canvas:
<Grid x:Name="ContentPanel" Grid.Row="0" Margin="12,0,12,0">
<Canvas Name="GameCanvas">
<Canvas.RenderTransform>
<CompositeTransform x:Name="CanvasRenderTransform" />
</Canvas.RenderTransform>
<toolkit:GestureService.GestureListener>
<toolkit:GestureListener DragStarted="GestureListener_DragStarted" DragDelta="GestureListener_DragDelta" Tap="GestureListener_Tap" PinchStarted="GestureListener_PinchStarted" PinchDelta="GestureListener_PinchDelta"/>
</toolkit:GestureService.GestureListener>
</Canvas>
<Client:TileMenu HorizontalAlignment="Center" VerticalAlignment="Center" Name="TileOverlayMenu" Background="Azure" BorderBrush="Aquamarine" BorderThickness="3" />
</Grid>
As for my third problem, having the events in the canvas causes the Move slider to be interrupted, making me only able to push it a little each time :-/
In case TileMenu is a UserControl you would have to set these properties on the top level container in the UserControl's XAML as this defines the entire visual structure of the control.
You could bind to the appropriate values in the UserControl, however:
<UserControl x:Class="YourNamespace.TileMenu" ...
x:Name="tileMenu">
<Border BorderBrush="{Binding BorderBrush, ElementName=tileMenu}"
BorderThickness="{Binding BorderThickness, ElementName=tileMenu}">
<Grid>
...
</Grid>
</Border>
</UserControl>

triggering an event at the storyboard end

I am new to silverlight and I want to trigger an even when the storyboard finsihes or ends. How would I go on doing that. I already have one trigger in storyboard at mouse enter. I am not sure if I can add more events there.
thanks
Use the "StoryBoardComplete" Behavior. You'll find it in the Assets panel under "Behaviors".
EDIT: Sorry, I answered in a hurry and incorrectly from memory. I should have given more details when you said you were new to Silverlight and I should have verified my answer.
CORRECTED ANSWER:
Use a "StoryboardCompletedTrigger" on a Behavior. Let's say you want to change the Fill property of a Rectangle when your Storyboard completes. Add a Rectangle to your application:
Go to the Assets panel (same tab group as the Projects panel). Open the category titled "Behaviors" and locate the "ChangePropertyAction".
Drag and drop one onto the Rectangle. Objects and Timeline will now look like so:
Note that the ChangePropertyAction item is selected. Now go to the Properties panel:
In the Trigger section, click on the "New" button that I've highlighted for you. This will open a dialog and let you pick a different TriggerType. In this case you want a "StoryboardCompletedTrigger":
Fill in the Storyboard and PropertyName values.
Now when Storyboard1 completes the Rectangle's Fill property should change to Red. Here is the compelte XAML code for this simple example:
<UserControl
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:i="http://schemas.microsoft.com/expression/2010/interactivity" xmlns:ei="http://schemas.microsoft.com/expression/2010/interactions" mc:Ignorable="d"
x:Class="SilverlightApplication2.MainPage"
Width="640" Height="480">
<UserControl.Resources>
<Storyboard x:Name="Storyboard1">
<DoubleAnimation Duration="0:0:0.9" To="-360" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.Rotation)" Storyboard.TargetName="rectangle" d:IsOptimized="True"/>
</Storyboard>
</UserControl.Resources>
<Grid x:Name="LayoutRoot" Background="White">
<Rectangle x:Name="rectangle" Fill="#FF0000F7" HorizontalAlignment="Left" Margin="86,133,0,225" Stroke="Black" Width="210" RenderTransformOrigin="0.5,0.5">
<Rectangle.RenderTransform>
<CompositeTransform/>
</Rectangle.RenderTransform>
<i:Interaction.Triggers>
<ei:StoryboardCompletedTrigger Storyboard="{StaticResource Storyboard1}">
<ei:ChangePropertyAction PropertyName="Fill">
<ei:ChangePropertyAction.Value>
<SolidColorBrush Color="Red"/>
</ei:ChangePropertyAction.Value>
</ei:ChangePropertyAction>
</ei:StoryboardCompletedTrigger>
</i:Interaction.Triggers>
</Rectangle>
<Button Content="Button" HorizontalAlignment="Left" Height="50" Margin="86,0,0,98" VerticalAlignment="Bottom" Width="110">
<i:Interaction.Triggers>
<i:EventTrigger EventName="Click">
<ei:ControlStoryboardAction Storyboard="{StaticResource Storyboard1}"/>
</i:EventTrigger>
</i:Interaction.Triggers>
</Button>
</Grid>
YMMV: This approach is for use with Behaviors. Without knowing your situation I can't make a better recommendation, but this is the typical way to accomplish what you want.