How can I create a DataTemplate with Expression Blend 3? - data-binding

I'm currently experimenting with Expression Blend 3 MIX09 version with the idea to use it primarily for an MVVM structured site with databinding, being able to view live data as I design. So far I've been very impressed and have to say that Blend 3's generated XAML is not as bad as people say it is. I got the following two examples working, one with data binding and one with user controls (views) being loaded dynamically. I can stay in Expression Blend 90% of the time while I design my application, seeing live data coming from my ViewModels as I design. I switch to Visual Studio only for e.g. creating config files, or adding references is easier. The improved intellisense of Blend 3 enabled me to stay in Blend for much of my coding as well:
MVVM base application that can be edited with Expression Blend and Visual Studio
How to structure a WPF application with DataBinding so you can enhance it in Expression Blend
One thing I'm surprised that I can't do in Expression Blend, though, is after I have created a ListBox, I would expect that I could do a right-click and create a DataTemplate. I can of course create a DataTemplate in code, then under Resources/Window I find it again, can click on a button next to it to "go into the DataTemplate" and see the controls inside in my Objects and Timeline panel, which is nice. But creating a DataTemplate from a control is so common, I would think there is a way to do it that I am just missing.
Where in Blend 3 can you "create a DataTemplate" for a ListBox or ListView, etc?
<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:local="clr-namespace:TestDynamic456"
mc:Ignorable="d"
x:Class="TestDynamic456.CustomersView"
x:Name="UserControl"
d:DesignWidth="640" d:DesignHeight="480">
<UserControl.Resources>
<local:CustomersViewModel x:Key="CustomersDataProvider"/>
</UserControl.Resources>
<StackPanel x:Name="LayoutRoot" Background="{x:Null}">
<ListBox ItemsSource="{Binding Path=GetAll, Source={StaticResource CustomersDataProvider}}"/>
</StackPanel>
</UserControl>

In Blend 3, you create a DataTemplate for ItemsControl's in the same place where you do it in Blend2 ;)
Right Click the control->Edit Other Templates->Edit Generated Items(ItemTemplate)->CreateEmpty

Related

Xamarin Forms - Get custom control runtime (with valueconverter?)

I have a Xamarin forms application. It has a page. That page has a listview. The listviews is bind to a sourcelist. What I want is to decide what custom control to use based on a specific property that each item in the list has. How can I achieve this?
It is also required that the custom control binds to values from the list.
I tried the following:
<ContentView Content="{Binding IsPriority, Converter={StaticResource RoadIndicatorBackgroundValueConverter}}" ControlText="{Binding TowingOrder.Location.RoadIndicator}"></ContentView>
That won't work because I can't bind with the ControlText of the specific custom control.
The image above shows the problem. The A1, A50 and the blue icons are all custom controls, those aren't images. There are some more of these custom controls. I can't just make 10 datatemplates right and copy paste everything? That would be so much duplicate code. Can't I just use a base object in a datatemplate, and bind a property with a converter and use a switch/case to decide which custom control to return?
It is not a good design to binding the content of whole layout in runtime.
From the screen shot , it seems that each cell are similar .So you could create a base Custom Control and define all controls in advance and binding the propertyIsVisible in code behind . Then set its value to control which element should been displayed .
If there are do many dig differences between the cells , use DataTemplateSelector is better .

How to use ComboBox in Xamarin forms

How to use ComboBox in Xamarin forms because xamarin forms does not have ComboBox Control, In my application i want to show list of country, so that user can select country(search as well as dropdown)both way, Give me suggestion to resolve this issue
Note:I found one solution syncfusion combobox but that is paid service, i don't want paid service
Xamarin Forms does include a combo box control, it just isn't called a combo box. XF calls it a Picker. It's pretty easy to use and includes properties you can bind to for ItemSource and SelectedItem/SelectedIndex.
You can use Picker control at xamarin to achieve list some objects in a box.
I recommend you to follow the MVVM pattern to bind datasource and handle events. There is code samples for it that created by Microsoft.
But basically you have to add a Picker to your xaml:
<StackLayout Margin="20">
<Label Text="Bindable Picker Demo" FontAttributes="Bold" HorizontalOptions="Center" />
<Picker Title="Select a country" ItemsSource="{Binding CountryList}" SelectedItem="{Binding SelectedColorName, Mode=TwoWay}" />
</StackLayout>
And in your model just set your Countrylist property and It is selected item.
public IList<string> CountryList
{
get
{
return new List<string> {"USA","Germany","England"};
}
}
If you want to make search in your Picker you have to create your own control. According your wishes an Entry and a Listview may be enough. You have to update your list in TextChanged event of Entry.
You can create your own ListView with ItemsSource as a country list, and SearchView with TextChanged method, where you change your ItemsSource by search value (and firstly, ItemsSource would be empty, because of empty search filter).
Also you can check this link, that could be also useful.
UPDATE:
If you need a searchable Picker, there is a github project, that you can use. It has a search. Link to project.
Using Picker Control is useful for creating Combo Box
Step1: Follow First Criteria for Layout Control in .xaml File
<StackLayout>
<Picker Title="Placeholder" BackgroundColor="Red" x:Name="liname"></Picker>
</StackLayout>
Step2: Now Add the the Values in .xaml.cs File
public yourcode()
{
InitializeComponent();
liname.Items.Add("class1");
liname.Items.Add("class2");
liname.Items.Add("class3");
liname.Items.Add("class4");
}
Now Start the Emulator in Vs, See the Output Screen Below of my Code
I got a solution guys. I am using picker instead of combo box, There is no combo box option in xamarin forms, If you want exact combo box, need to subscribe syncfusion

How can I get MVVM Light to work nicely with a Grouped Items Page in Metro?

I am trying to implement a Metro style Grouped Items Page using the MVVM Light framework following the sample in this blog post but using a ViewModelLocator to provide blendability:
http://mikaelkoskinen.net/post/winrt-tutorial-mvvm-gridview-semanticzoom.aspx
I have got this working, unfortunately the grid itself is not showing up in the designer (which is the point of me using MVVM Light). I have bound the title without problem so I know that the viewmodel is bound correctly.
Any ideas please?
I had the same problem. The issue is, if you're using a CollectionViewSource, that it needs to be explicitly, like this:
As MVVM Light injects design-time-services into the viewmodel you'd expect this to pick up your service and push the design-time data through your viewmodel to the UI. But it doesn't.
You need to give it an explicit design-time instance for this to work:
There is a useful article about using CollectionViewSource in design mode that may help.

Reuse xaml sub-workflows - from toolbox drag and drop into new xaml workflow

I have a number of xaml sub-workflows that I would like to reuse in other xaml workflows. These sub-workflow use receive and send activities so writing them in code is a pain for us mortals.
I would think this is a common scenario but I can't find a good reference that would list the steps to accomplish this. Here is what I am looking to do:
1- Desing a sub-workflow xaml.
2- Add an entry in the toolbox (both VS and hosted WF Designer) with drag and drop ability
3- Ability to use a custom UI of the dropped sub-workflow and not display all the contained activites
4- When the completed xaml workflow is saved, the sub-workflow would be saved as part of it as xaml.
Any thoughts or suggestions would be greatly appreciatd.
Thanks,
Kas
You can do that using XamlServices.Save(filename, activity);
It is not possible to add an entry in the toolbox from a xaml file, because only compiled type can be added to the toolbox (both in VS and rehosted designer). I suggest you have a listview or treeview instead, and implement drag and drop for this listview or treeview so that you can drag the xaml activities to the designer. (So this listview will be the substitute for toolbox.
I don't think this is possible either. If you implement (2) the contained activity will appear. If you want custom designer, you will have to create a compiled type for it.

Indirect binding to child collections in XAML

I am currently using a Linq template with SubSonic3 to create my models. I have a simple Member class, which has a collection of Notes. A Note class has a PublishedDate and Title properties.
I have a UserControl which has a collection of Members for its DataContext. There are two ListBoxes and a bunch of TextBoxes and other controls on it. The first ListBox (membersList) gets its ItemsSource from the UserControl DataContext and it displays a few Member properties in each item. I would like the second ListBox (notesList) to display the Notes collection of the Member selected in the first ListBox.
So far on notesList I have:
<ListBox ... ItemsSource="{Binding Notes}"...>
<DataTemplate>
<TextBox Text="{Binding Title}"/>
</DataTemplate>
It partially works. When I selected a Member which has Note items there is the correct number of items in notesListBox but this is only visible in the alternating row colours - nothing else! The DataTemplate fails to render the Title of the Note. Basically all the visual styles in the ListBox and ListBoxItem works - alternating colours, selection border, mouseover, etc. but the content is not shown. I have a feeling the problem is my Binding syntax but I can't figure out what's wrong.
Any suggestions would be greatly appreciated.
Cheers,
Dany.
Make sure your template includes a ContentPresenter. It sounds like you may have left this out when you templated your list box.
Leaving this out could lead to the behavior you're experiencing - full template, but no "content", since there's no place for it to place the actual items that should go in each list box item.

Resources