Difference between revisions of "Databinding"
Jump to navigation
Jump to search
(added d:DataContext and BindingProxy info) |
(cleaning up) |
||
| Line 13: | Line 13: | ||
=== d:DataContext === | === d:DataContext === | ||
::Some XAMLs will have references using the <b>d:DataContext</b> tag. This is more of a developer's note. It does not actually bind anything. It's useful to let the developer know where to look. If a xaml doesn't have one, it's probably loaded in through BindingProxy. That is not always the case. | ::Some XAMLs will have references using the <b>d:DataContext</b> tag. This is more of a developer's note. It does not actually bind anything. It's useful to let the developer know where to look. If a xaml doesn't have one, it's probably loaded in through BindingProxy. That is not always the case. | ||
| − | <div style=" | + | <div style="display:flex;justify-content:center;"> |
<Grid x:Class="TruxtonClient.Views.Dashboard" | <Grid x:Class="TruxtonClient.Views.Dashboard" | ||
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" | xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" | ||
| Line 40: | Line 40: | ||
::BindingProxy is a tool used to reference a specific Databinding source elsewhere in the code where it may not be readily available. For example, a template resource can be used in multiple Views. The BindingProxy can be used to pass a specific View's DataContext into the template instance. | ::BindingProxy is a tool used to reference a specific Databinding source elsewhere in the code where it may not be readily available. For example, a template resource can be used in multiple Views. The BindingProxy can be used to pass a specific View's DataContext into the template instance. | ||
| − | ::{| class="wikitable" | + | <div style="display:flex;justify-content:center;"> |
| + | {| class="wikitable" | ||
! Example | ! Example | ||
|- | |- | ||
| Line 80: | Line 81: | ||
|- | |- | ||
|} | |} | ||
| + | </div> | ||
| − | In the example above, the Home View loads the LeftSideNav template and passes its Navigation | + | :::In the example above, the Home View loads the LeftSideNav template and passes its DataContext of Navigation to the LeftSideNav template. |
Revision as of 11:19, 2 November 2021
This page documents the Navigation/Routing of the application, or how each "page" is navigated. This document is intended to detail the initial resources that are used when the application loads each page or view.
UI Guide Menu
Databinding
- There are multiple ways to bind data. I'll describe the most complex and most used ones below.
d:DataContext
- Some XAMLs will have references using the d:DataContext tag. This is more of a developer's note. It does not actually bind anything. It's useful to let the developer know where to look. If a xaml doesn't have one, it's probably loaded in through BindingProxy. That is not always the case.
<Grid x:Class="TruxtonClient.Views.Dashboard"
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:i="http://schemas.microsoft.com/xaml/behaviors"
xmlns:controls="clr-namespace:TruxtonClient.Controls;assembly="
xmlns:uicore="clr-namespace:Truxton;assembly=Truxton.UI.Core"
xmlns:converters="clr-namespace:TruxtonClient.Converters;assembly="
xmlns:behaviors="clr-namespace:TruxtonClient.Behaviors;assembly="
xmlns:local="clr-namespace:TruxtonClient;assembly="
xmlns:models="clr-namespace:TruxtonClient.Models;assembly="
xmlns:MahAppsControls="clr-namespace:MahApps.Metro.Controls;assembly=MahApps.Metro"
xmlns:viewModels="clr-namespace:TruxtonClient.ViewModels;assembly="
xmlns:ig="http://schemas.infragistics.com/xaml"
xmlns:vm="clr-namespace:TruxtonClient.ViewModels"
d:DataContext="{d:DesignInstance Type=vm:DashboardViewModel}"
mc:Ignorable="d"
d:DesignHeight="600"
d:DesignWidth="800"
Background="White">
BindingProxy
- BindingProxy is a tool used to reference a specific Databinding source elsewhere in the code where it may not be readily available. For example, a template resource can be used in multiple Views. The BindingProxy can be used to pass a specific View's DataContext into the template instance.
| Example |
|---|
Views/Home/Home.xaml
<Grid x:Class="TruxtonClient.Views.Home"
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="600"
Background="White"
xmlns:vm="clr-namespace:TruxtonClient.ViewModels"
d:DataContext="{d:DesignInstance Type=vm:HomeViewModel}">
<DockPanel SnapsToDevicePixels="True">
<ContentControl Content="{Binding Navigation}"
ContentTemplate="{StaticResource LeftSideNav}" />
<Grid Name="ChildContainer" />
</DockPanel>
</Grid>
|
TruxtonClient/Templates/LeftSideNav.xaml ~Line 453
<DataTemplate x:Key="LeftSideNav">
<Border Style="{StaticResource LeftSidePanel}">
<Border.Resources>
<uicore:BindingProxy x:Key="BindingProxy"
Data="{Binding}" />
<DataTemplate x:Key="LeftSideNavListItem">
<Button Style="{StaticResource SideNavButton}"
Command="{Binding Data.Select,
Source={StaticResource BindingProxy}}"
CommandParameter="{Binding}"
Tag="{Binding Name}"
ToolTip="{Binding ToolTip}">
|
- In the example above, the Home View loads the LeftSideNav template and passes its DataContext of Navigation to the LeftSideNav template.