XAML And Dependency Injection - xaml

I have a dialog box that is created using MEF and it has an exposed member in its View Model called 'Container' which is a reference to the CompositionContainer. Inside that dialog box is a drop down combobox that has a selection of customers. I want to select a customer from a list that is created from the shared data model. My dialog looks like this:
<Window x:Class="MyNamespace.MyDialog"
xmlns:common="http://schemas.teraque.com/common"
ShowInTaskbar="False"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation">
<Grid Margin="4">
<Grid.RowDefinitions>
<RowDefinition/>
<RowDefinition/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition />
<ColumnDefinition />
</Grid.ColumnDefinitions>
<common:ProductComboBox Grid.Row="1" Grid.Column="1"/>
<TextBlock Text="Product" Grid.Row="0" Grid.Column="0"/>
<common:CustomerComboBox Grid.Row="1" Grid.Column="1"/>
<TextBlock Text="Customer" Grid.Row="1" Grid.Column="0"/>
</Grid>
</Window>
So how do we go about passing along the DI composition container to the Product or Customer combo boxes so they can query the shared services for the product and customer data? I've toyed around with the idea of referencing the container from the parent view model:
<common:CustomerComboBox Container="{Binding Container}"
Grid.Row="1" Grid.Column="1"/>
Is there a better way?

Related

How do i extract an item out of a session object?

Still learning visual studio and it's elements :-)
My question is as follows...
How do i extract "for example" the [clientname] out of session object using a xaml resource designer?
The session it's self is "CurrentSession" realistically i would like this to be dynamic so that i could use my listview template on any listview. I have been following the courses Here and this has helped me immensely but i cannot seem to work out how to do this from a session object, any help would be greatly appreciated :-)
a part of my xaml designer for a listview....
<DataTemplate x:Key="templateListBoxItem">
<Grid Margin="5">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"></ColumnDefinition>
<ColumnDefinition Width="*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition></RowDefinition>
<RowDefinition></RowDefinition>
</Grid.RowDefinitions>
<Border Grid.Column="0"
Grid.Row="0"
Grid.RowSpan="2"
Margin="0,0,10,0">
<Image Source="{DynamicResource IMS}"
Stretch="Fill"
Height="20"
Width="20"/>
</Border>
<ItemsControl ItemsSource="{Binding CurrentSession[clientName]}">
<TextBlock Text="{Binding clientName}"
Grid.Row="0"
Grid.Column="1"
FontWeight="Bold"/>
</ItemsControl>
</Grid>
</DataTemplate>

Binding data to layout

I am rookie in xamarin and I want to achieve a grid, with the feature scrollanle, but I canĀ“t get it. I reach this:
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="50"></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1*"></ColumnDefinition>
<ColumnDefinition Width="3*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Button Text="Correct" Grid.Row="0" Grid.Column="0" Clicked="OnStartClicked"/>
<Label Grid.Row="0" Grid.Column="1" Text="my_data_binded_from_my_dto" XAlign="Center" YAlign="Center"/>
</Grid>
Any help?
Thanks you all
Before at all, wellcome to stackoverflow. Hoping we can help you and you enjoy for being part of this community.
I think your best choice for achieving this is using a listview for binding your grid layout with your dto. Inside of your list view you can define a template which will be render in the list view, this template could be any layout. In your case, your grid.
I coded an example for you. Please, check it out, and let me know any doubt you could have. Cheers.
<ListView x:Name="listView" ItemsSource="{Binding .}">">
<ListView.ItemTemplate>
<DataTemplate>
<ViewCell>
<ViewCell.View>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="50"></RowDefinition>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1*"></ColumnDefinition>
<ColumnDefinition Width="3*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Button Text="Correct" Grid.Row="0" Grid.Column="0" Clicked="OnStartClicked"/>
<Label Grid.Row="0" Grid.Column="1" Text="my_data_binded_from_my_dto" XAlign="Center" YAlign="Center"/>
</Grid>
</ViewCell.View>
</ViewCell>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
Remember to link your model with your listview, you can this from code-behind (constructor):
this.BindingContext = your_model;

Windows 8 XAML Layout Issues - anchor control on right side of screen

I'm struggling to understand how the xaml controls can help me accomplish the following layout:
I have a 3-column layout. The leftmost and center columns have listviews. The rightmost column simply has a clickable (tappable) stackpanel that navigates elsewhere. I want this stackpanel to be anchored to the right side of the page, halfway down (i.e. in CSS I would say right: 0, top: 50%).
My XAML is below. My strategy has been to create a horizontal parent stackpanel containing all 3 columns, and a vertical stackpanel with a textblock on top of a listview control in the leftmost and middle columns. However, the third stackpanel behaves in some unexpected ways:
It does not fill the horizontal space remaining to the right of the second stack panel. It seems to prefer to only take up the space required by whatever its child controls require. This means that I have to assign static values to child elements to try to line the clickable control up with the right side of the page. This means that when screen resolutions are different than what I'm designing for, this clickable control will be either off the right side of the page, or toward the middle of the page.
I can't coerce the clickable element in the third column (stackpanel, or any other control I try to use) to move halfway down the page. As I mentioned above, I want it to be halfway down the page, but it stubbornly sits at the top of its containing stackpanel.
I've looked at the canvas control, but don't want this to be static - this is so easy in CSS, I'm not sure why it's so complicated in XAML.
<!--
This grid acts as a root panel for the page that defines two rows:
* Row 0 contains the back button and page title
* Row 1 contains the rest of the page layout
-->
<Grid Style="{StaticResource LayoutRootStyle}">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="1160"/>
<ColumnDefinition Width="206"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="140"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<!-- Back button and page title -->
<Grid Grid.ColumnSpan="2">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Button x:Name="backButton" Click="GoBack" IsEnabled="{Binding Frame.CanGoBack, ElementName=pageRoot}" Style="{StaticResource BackButtonStyle}"/>
<TextBlock x:Name="pageTitle" Grid.Column="1" Text="{StaticResource AppName}" Style="{StaticResource PageHeaderTextStyle}"/>
</Grid>
<StackPanel Orientation="Horizontal" Grid.Row="1" HorizontalAlignment="Stretch" Grid.ColumnSpan="2">
<StackPanel
Orientation="Vertical"
Margin="0,0,40,0">
<StackPanel
Height="100"
Width="400"
HorizontalAlignment="Left"
Margin="40,15,0,0">
<StackPanel.Background>
<SolidColorBrush>
<Color>#FFFFFF</Color>
</SolidColorBrush>
</StackPanel.Background>
<TextBlock
Text="Announcements"
FontSize="42"
FontWeight="Light"
TextAlignment="Left"
Padding="0,25,25,25">
</TextBlock>
</StackPanel>
<ListView
HorizontalAlignment="Left"
Height="475"
Margin="40,15,0,0"
VerticalAlignment="Top"
Width="400"
ItemsSource="{Binding Incidents}"
IsItemClickEnabled="True"
SelectionMode="None"
ItemTemplate="{StaticResource Standard130ItemTemplate}"
ItemClick="Item_Click" >
</ListView>
</StackPanel>
<StackPanel
Orientation="Vertical"
Margin="40,0,0,0">
<StackPanel
Height="100"
Width="600"
HorizontalAlignment="Right"
Margin="0,15,40,0">
<StackPanel.Background>
<SolidColorBrush>
<Color>#FFFFFF</Color>
</SolidColorBrush>
</StackPanel.Background>
<TextBlock
Text="News from Yammer"
FontSize="42"
FontWeight="Light"
TextAlignment="Left"
Padding="0,25,25,25">
</TextBlock>
</StackPanel>
<ListView
HorizontalAlignment="Left"
Height="475"
Margin="40,15,0,0"
VerticalAlignment="Top"
Width="Auto"
ItemsSource="{Binding Incidents}"
IsItemClickEnabled="True"
SelectionMode="None"
ItemTemplate="{StaticResource Standard130ItemTemplate}"
ItemClick="Item_Click" >
</ListView>
</StackPanel>
<StackPanel Background="AliceBlue" Width="206" Height="628">
<TextBlock x:Name="stackPanel" Background="Black" Height="50" Width="20" HorizontalAlignment="Right" Margin="10,100,10,0" Opacity="0"/>
</StackPanel>
</StackPanel>
StackPanels only give enough space to their child elements as the need. I would recommend the following:
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<StackPanel Grid.Column="2" HorizontalAlignment="Stretch" VerticalAlignment="Center">
<!-- Right most column -->
</StackPanel>
</Grid>
This was the stack panel stretches to fit the column.

Windows 8 Ad sdk hides Charm bar window (About us)

In my windows 8 application i have a advertisement in right side of window. When i choose the about page from my charm bar settings pane, the ad sdk control remain in top of the about page.. looks like below...
MainPage.xaml,
<Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">
<ads:AdControl Width="160" Height="600" IsEnabled="False" HorizontalAlignment="Right" AdUnitId="10043134" ApplicationId="d25517cb-12d4-4699-8bdc-52040c712cab"></ads:AdControl>
</Grid>
About.xaml(User Control),
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="100"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<Grid Background="#000000">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Button x:Name="butAboutus" IsEnabled="{Binding Frame.CanGoBack, ElementName=pageRoot}" Style="{StaticResource SnappedBackButtonStyle}" />
<TextBlock x:Name="pageTitle" Grid.Column="1" Foreground="White" Text="About" Style="{StaticResource PageHeaderTextStyle}" FontSize="30" Margin="0,0,27,39"/>
</Grid>
<Grid Grid.Row="1" Background="White">
<StackPanel Orientation="Vertical" Margin="20,20,0,0">
<TextBlock Text="Sample about" FontSize="15" Foreground="Black" TextWrapping="Wrap" Margin="0,0,0,15"/>
</StackPanel>
</Grid>
</Grid>
what am i doing wrong? how can i solve this problem...?
Thanks in advance.
You will have to hide the ad control when you want to display something on top of it. The ad control uses the WebBrowser, which has the (annoying) property of always being on top.
As Wilbur suggested the adcontrol currently uses webview (browser control) and would always appear on top, therefore you'd need to toggle it's visiblity before showing the flyout or popup control. The other nuisance of this control is that it will also take away the focus from the app whenever the ads are refreshed (you might want to set IsEnabled property to false to fix that).
Personally in my view webview and adcontrol are the two controls that needs to be re-written :(

UserControl for a Row in a Grid

I have following Grid:
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<!-- GridRow-Definition -->
<Label Grid.Row="0" Grid.Column="0">FirstRow:</Label>
<TextBox Grid.Row="0" Grid.Column="1" Text="{Binding Binding_To_First_Row}" />
<Label Grid.Row="1" Grid.Column="0">SecondRow:</Label>
<TextBox Grid.Row="1" Grid.Column="1" Text="{Binding Binding_To_Second_Row}" />
<!-- many more Label-TextBox-Rows -->
</Grid>
Question:
Is there a way to Create a UserControl which contains the Label and TextBox and properly aligns the first Column in a proper way?
The answer is yes, it is possible, but perhaps you should be using a DataGrid or an ItemsControl with a DataTemplate.
The simple answer to your question though is, if you need grid columns in different grids to synchronize their widths, you use the SharedSizeGroup attribute, e.g:
<UserControl>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition SharedSizeGroup="column1" Width="auto"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
</Grid>
</UserControl>
Then in a parent element you use Grid.IsSharedSizeScope="True"
<StackPanel Grid.IsSharedSizeScope="True">
<local:UserControl1/>
<local:UserControl1/>
</StackPanel>
This synchronizes any columns (or rows) that have the same SharedSizeGroup within that scope (you can have multiple nested scopes).