Panorama Title binding - windows-phone-7

I'm doing WP7 app using Panorama control and have a problem with binding into Panorama Title property. Is it possible to bind that value out from ViewModel object?
Binding in xaml file:
<controls:Panorama x:Name="prmPanorama" Title="{Binding Voyage.Title}">
Voyage property of ViewModel is a Model entity (with Title property inside) with OnNotifyPropertyChanged event fired every time it changes:
private Voyage _voyage;
public Voyage Voyage
{
get { return _voyage; }
set
{
if (_voyage != value)
{
_voyage = value;
OnNotifyPropertyChanged("Voyage");
}
}
}
When I bind the same property into another control, eg. TextBlock, binding works just fine:
<TextBlock Text="{Binding Voyage.Title}" />
The text shown in that text block is as it should be but on the same time panorama title is not binded right - it's collapsed.
Does anyone tried to do that kind of binding? I have no idea why it doesn't work.

<DataTemplate x:Key="TitleDataTemplate">
<TextBlock Text="{Binding}" />
</DataTemplate>
...
<controls:Panorama Title="{Binding Voyage.Title}"
TitleTemplate="{StaticResource TitleDataTemplate}">
The control template of the panorama control uses a content presenter to display whatever value the its title property has kind of like a button. When setting the title template property, you indirectly set the content template of the content presenter.
That is why you have to set the title property on the panorama control and then can use that value in your title template for binding. In other words its not enough to just bind to the title you have to give it a template.
Check out this link for more info

Related

How to bind a view model property to a XAML control

Please let me know if Ill be able to bind a property value of a view model to a XAML control.
XAML:
<Emtry x:Key="addressLine1" />
ViewModel:
public string addressLine1 { get; set; }
Is it possible to create a two way binding?
You will have to do it like this: <Entry Text="{Binding addressLine1, Mode=TwoWay}" />
The x:Key doesn't have much to do with it. You will have to bind to the property of the control that you want to use. In this case, on the Entry you want to bind it to the Text property so you can show it to the user and the user can edit it.
Then with the notation of {Binding addressLine1, Mode=TwoWay} you specify which property of the view model to bind to and what the mode should be. You can leave the mode out, then it will have the default value which is OneWay most of the time.
To make the connection between the XAML and the view model, you will still have to specify the DataBinding property on the code-behind of the XAML page.
<Entry x:Name="entAddress" Text="{Binding addressLine1}"/>

How to preview an ItemTemplate in the XAML designer

Say I have a simple ItemTemplate for a ListView
<ListView ItemsSource="{x:Bind ListItems}">
<ListView.ItemTemplate>
<DataTemplate x:DataType="local:TextItem">
<TextBlock Text="{x:Bind Item}"/>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
MainPage.xaml
When I run the app, I get a ListView populated with TextBlocks - one for each item in ListItems (which is a behind defined variable). However, in the XAML designer, I see nothing.
So, is there a way to preview the ItemTemplate/DataTemplate in the XAML designer, with a set number of placeholder TextBlocks with placeholder text replacing the Text="{x:Bind Item}"? Or just preview a single TextBlock?
This is not a duplicate of
Design View of a DataTemplate in a ResourceDictionary in Visual Studio - because I can't use Blend. Everything I've looked up that says use Blend in a certain way merely gives me the message 'This feature is not available for projects targeting "Windows 10 Fall Creators Update (10.0; Build 16299)"'
Can I preview my DataTemplate(s) in my collection-based controls in the designer? - well, perhaps it is, but I don't understand the accepted answer, which is now several years old. An answer containing an example tailored to my question would be really helpful.
Microsoft actually posted a (semi helpful) tutorial on this in April of this year: link
Requirements
Whatever you want to display, you will need this at the top of your XAML code (should be there by default if you created the page using VS's templates):
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
A simple list of strings
For something simple like a list of strings, something like this will work just fine (taken from the above mentioned MSDN page):
<ListView>
<d:ListView.Items>
<system:String>Item One</system:String>
<system:String>Item Two</system:String>
<system:String>Item Three</system:String>
</d:ListView.Items>
</ListView>
Display something more complex
If you want to use a data source from somewhere else in your code, it gets a little more ugly:
First you need to set your data context (usually done at the page level, but you can also add it just on the element where you want to use it):
d:DataContext="{d:DesignInstance
yournamespace:YourDataSourceClass,
IsDesignTimeCreatable=True}"
And on the ListView add:
d:ItemsSource="{Binding data}"
If you are using an ItemTemplate, you will need to add "d:" variants for everything you want to pull from your data source.
Full example code:
XAML:
<Page
x:Class="exampleApp.MainPage"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:local="using:exampleApp"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
mc:Ignorable="d"
d:DataContext="{d:DesignInstance local:DesignTimeData,
IsDesignTimeCreatable=True}"
Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<Grid>
<Grid>
<ListView ItemsSource="{x:Bind ListItems}" d:ItemsSource="{Binding DummyData}">
<ListView.ItemTemplate>
<DataTemplate x:DataType="local:TextItem">
<TextBlock Text="{x:Bind Item}" d:Text="{Binding Item}"/>
</DataTemplate>
</ListView.ItemTemplate>
</ListView>
</Grid>
</Grid>
</Page>
C#:
using System.Collections.ObjectModel;
using Windows.UI.Xaml.Controls;
namespace exampleApp {
public sealed partial class MainPage : Page {
public ObservableCollection<TextItem> ListItems;
public MainPage() {
this.InitializeComponent();
//populate you ListItems list
}
}
public class TextItem {
public string Item { get; set; }
}
public class DesignTimeData {
public ObservableCollection<TextItem> DummyData { get; set; } = new ObservableCollection<TextItem> {
new TextItem { Item = "foo" },
new TextItem { Item = "bar" },
new TextItem { Item = "bla" },
new TextItem { Item = "blubb" }
};
}
}
Remarks
It seems you have to use "Binding" rather than "x:Bind" for the design-time bindings. From what I understand, x:Bind works using code generated at compile time, which is not executed by the XAML designer
When you change your Binding declarations or data source code, you will have to recompile to see the changes in the designer. Other design changes will reflect in real time
Binding is more limited than x:Bind in some regards (notably you cannot bind to class methods using Binding, only x:Bind). Keep that in mind when writing your design-time data
Sadly some of the more convenient ways of getting design-time data into your app are WPF and Xamarin only (Blends' data window, data declared in XAML file, and especially auto-generated sample data)
(Everything was tested using Visual Studio 2019 version 16.10.3.)

When using a text cell, is it possible to get the value of the text when it is tapped?

The text cell is inside of a listview. I'm populating the text of the text cell with data using Binding. I need to actually get the value of the text when the text cell is clicked on. Is there a way to do this?
XAML file:
<ListView ItemsSource="{Binding MyItems}" ItemTapped="{Binding OnItemTapped}">
<ListView.ItemTemplate>
<DataTemplate>
<TextCell Text="{Binding Key}" />
</DataTemplate>
</ListView.ItemTemplate>
</ListVIew>
You bind the ItemTapped event to a custom event handler using Binding.
In codebehind, e.Item will contain the tapped item, from which you can extract the Key and Value.
Codebehind:
public class MyPage : ContentPage
{
...
private async void OnItemTapped(object sender, ItemTappedEventArgs e)
{
var tappedItem = e.Item;
// do something with tappedItem.Value...
}
}
Edit/Note: You will need to override the ToString() method in your model class in order to display whatever you want. You get the namespace displayed because that's the default behavior of calling ToString() on any object.
You could subscribe to ItemTapped or ItemSelected ListView events and pull your item from ItemTappedEventArgs.Item (in case of ItemTapped event) or SelectedItemChangedEventArgs.SelectedItem (in case of ItemSelected event) . More info in official Xamarin documentation
If you using MVVM approach look at EventToCommandBehavior and Converter.
Xamarin have good example here

how to checkbox checked for all in listbox datasource in wp8?

while selecting all means renaming all the checkbox are checked. my code is below:
<ListBox Name="VillageList">
<ListBox.ItemTemplate>
<DataTemplate>
<CheckBox IsChecked="{Binding isCheched}" Content="{Binding Villages}" IsChecked="False"/>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
so all checkbox are inside the listbox.how to checked is enable for all checkbox single selection.
public class villageinformation
{
public string Villages{get;set;}
public bool isChecked {get;set;}
}
page.cs{
list<villageinformation> mydataSource=new list<villageinformation>();
myDataSource.Add(new villageinformation(){Village="All",isChecked ="False"});
myDataSource.Add(new villageinformation(){Village="name1",isChecked ="False"});
myDataSource.Add(new villageinformation(){Village="name2",isChecked ="False"});
myDataSource.Add(new villageinformation(){Village="name3",isChecked ="False"});
VillageList.itemSource=myDataSource;
}
so while clicking manually "All" checkbox remaining name1,2,3 are selected how to do this?
If you are using the ObservableCollection for your villages list, which is used for the data binding to the ListBox, then you can set all values in the ObservalbeCollection in the codebehind which shoul update the UI (by checking all the Checkboxes)
you can do it something like this
foreach(var village in VillagesCollection)
{
village.isChecked = true;
}
If you are not able to understand the above, edit your question with how you are setting up the Village data in the code behind file (means .xaml.cs file)

SelectedItem set to first item with CollectionViewSource

I have a view databound through mvvm light to a viewmodel in my WP7 project.
The view contains a Listbox with following settings:
<ListBox x:Name="StationList"
ItemsSource="{Binding StationList}"
SelectedItem="{Binding SelectedStation, Mode=TwoWay}"
>
The StationList is a ObservableCollection.
Now when the view gets loaded, everything looks great! The list is shown and NO item is selected!
But when I change the XAML to:
<ListBox x:Name="StationList"
ItemsSource="{Binding Source={StaticResource StationListSorted}}"
SelectedItem="{Binding SelectedStation, Mode=TwoWay}"
>
With the StationListSorted being a simple one property sort on the StationList as a CollectionViewSource.
Now things turn ugly!!
The same view is loaded with the same items in the listbox, but now correctly sorted, BUT the first item is selected and the selectedItem property is set!!
How can I sort a ListBox with a CollectionViewSource WITHOUT it auto selecting my first item?
On your listbox, try setting IsSynchronizedWithCurrentItem and see which value (either true or false) produces the desired effect.

Resources