I have a ListPicker in my app which is defined like that:
<DataTemplate x:Name="PickerItemTemplate">
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding code}" Margin="12 0 0 0" Visibility="Collapsed"/>
<TextBlock Text="{Binding name}" Margin="12 0 0 0"/>
</StackPanel>
</DataTemplate>
<DataTemplate x:Name="PickerFullModeItemTemplate">
<StackPanel Orientation="Horizontal" Margin="16 21 0 20">
<TextBlock Text="{Binding name}" Margin="16 0 0 0"
FontSize="43" FontFamily="{StaticResource PhoneFontFamilyLight}"/>
</StackPanel>
</DataTemplate>
<toolkit:ListPicker x:Name="_1stLanguageListPicker"
ItemTemplate="{StaticResource PickerItemTemplate}"
FullModeItemTemplate="{StaticResource PickerFullModeItemTemplate}"
Header="1st Specie Name Language"
FullModeHeader="1st Specie Name Language"
CacheMode="BitmapCache"/>
As you can see I show to user only the full name, hidding the code. But as a programmer I would like to use code name.
How to get to this name?
I have tried like that
if (_1stLanguageListPicker.SelectedIndex == 0)
{
firstlang = "GB"
}
But not working (some bool to int problem, normal = doesn't work also) and this is a bad way for many items list as you have to put many many IF statements.
What I understand is, Your problem is to get the data of the code TextBlock in the code behind.
First give some name to your TextBlock
<TextBlock x:Name="codeTextBlock" Text="{Binding code}" />
And then use the following code to access the 'code'
if (listPicker.SelectedIndex > -1)
{
var item = listPicker.ItemContainerGenerator.ContainerFromIndex(listPicker.SelectedIndex);
SearchVisualTree(item);
}
Here, SearchVisualTree() is:
private void SearchVisualTree(DependencyObject targetElement)
{
var count = VisualTreeHelper.GetChildrenCount(targetElement);
if (count == 0)
return;
for (int i = 0; i < count; i++)
{
var child = VisualTreeHelper.GetChild(targetElement, i);
if (child is TextBlock)
{
TextBlock targetItem = (TextBlock)child;
if (targetItem.Name == "codeTextBlock")
{
var code = targetItem.Text;
return;
}
}
else
{
SearchVisualTree(child);
}
}
}
One possible problem here is(which you faced), we cannot access the DataTemplate before ListPicker is Loaded. In other workds, before DataTemplate is generated for the ListPicker.
So the placement of the above code is very important.
Hope this helps
Related
I wanted to Develop a similar layout like Longlist Selector Wp8 in Windows phone 8.1.
I came across a issue, my list is not appearing.
XAML page
<Grid >
<Grid.Resources>
<CollectionViewSource x:Name="MainGrps"
IsSourceGrouped="True"/>
</Grid.Resources>
<ListView ItemsSource="{Binding Source={StaticResource MainGrps}}" Margin="50">
<ListView.ItemTemplate>
<DataTemplate >
<Grid Background="Gray">
<StackPanel>
<TextBlock Foreground="White" FontSize="20" Text="{Binding ItmName}"/>
<TextBlock Foreground="White" FontSize="20" Text="{Binding ItmType}"/>
</StackPanel>
</Grid>
</DataTemplate>
</ListView.ItemTemplate>
<ListView.GroupStyle>
<GroupStyle HidesIfEmpty="True" >
<GroupStyle.HeaderTemplate>
<DataTemplate >
<Grid Background="Red">
<StackPanel Orientation="Horizontal" >
<TextBlock Text="{Binding GrpItmName}" Foreground="White"/>
<TextBlock Text="{Binding ItemsCount}" Foreground="White"/>
</StackPanel>
</Grid>
</DataTemplate>
</GroupStyle.HeaderTemplate>
</GroupStyle>
</ListView.GroupStyle>
</ListView>
</Grid>
Code Behind:
private void OnPageLoaded(object sender, RoutedEventArgs e)
{
lst_grp = new List<Grp>();
for (int i = 0; i < 10; i++)
{
Grp grp = new Grp();
grp.GrpItmName = "grp name " + i;
grp.ItemsCount = i;
grp.LstItms = new List<Itm>();
Itm itm = new Itm();
itm.ItmName = "itm name " + i;
itm.ItmType = "itm type " + i;
grp.LstItms.Add(itm);
grp.LstItms.Add(itm);
grp.LstItms.Add(itm);
lst_grp.Add(grp);
}
this.MainGrps.Source = lst_grp;
}
Is there any problem with above code?
Please help me to figure it out or suggest if you have working code.
Change
<GroupStyle HidesIfEmpty="True" >
to:
<GroupStyle HidesIfEmpty="False" >
Try to add this in the XAML inside the ListView tag:
HorizontalAlignment="Stretch" VerticalAlignment="Stretch"
Or try to set the width and the height parameter of the ListView manually.. Just to try..
Let me know!
I have a listpicker which showing item names. When selecting a item I want to get the Item Id for that selected Item.How can I do That?
<toolkit:ListPicker x:Name="lstItem"
FullModeHeader="Item"
SelectionMode="Single"
ItemsSource="{Binding getItems}"
ExpansionMode="FullscreenOnly"
Margin="12,5,10,0"
Grid.Row="0"
Grid.Column="1"
Background="White"
FontSize="21"
Header=""
Foreground="Black"
BorderThickness="0" Grid.ColumnSpan="2" SelectionChanged="lstItem_SelectionChanged"
>
<toolkit:ListPicker.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding Name}" />
</DataTemplate>
</toolkit:ListPicker.ItemTemplate>
<toolkit:ListPicker.FullModeItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" Margin="16 15 0 15">
<TextBlock Text="{Binding Name}"
Margin="0 0 0 0"
FontSize="25"
FontFamily="{StaticResource PhoneFontFamilyLight}"/>
</StackPanel>
</DataTemplate>
</toolkit:ListPicker.FullModeItemTemplate>
</toolkit:ListPicker>
In C# Code I'm binding both to listpicker.This data directly I'm binding to list picker.
public ObservableCollection<Items> bindItems()
{
listItems.Clear();
//int i = Common.intCustomerId; //&& btypes.ChqRtnPaymentNo == ""
var itemlist = from DailyItemStock DailyItm in APPCommon.SFADB
join ItemMaster IM in APPCommon.SFADB on DailyItm.ItemMasterID equals IM.ID
where DailyItm.StockDate == System.DateTime.Today
select new
{
DailyItm.ItemMasterID,
DailyItm.BatchNo,
IM.Name
};
listItems.Add(new Items() { ItemMasterID = 0, Name = "Select One" });
foreach (var lists in itemlist)
{
listItems.Add(new Items()
{
ItemMasterID = lists.ItemMasterID,
BatchNo = lists.BatchNo,
Name = lists.Name,
});
}
itemlist = null;
return listItems;
}
One possible way :
Items selectedItem = (Items)lstItem.SelectedItem;
int id = selectedItem.ItemMasterID;
in order to get the id number you have to create it in the database.
example
SHOP_ID ='4987bc1b-c0a8-6cb7-12f4-0243011f7099' and (debitor_type is null or debitor_type in (CASE WHEN (select techfund_debitor_enabled from impl_shop where shop_id='4987bc1b-c0a8-6cb7-12f4-0243011f7099')
I have 3 panorama items defined in xaml. I am setting visibility=collapsed for 2nd and 3rd panorama item .
In code behind I am setting visibility=Visible for 2nd and 3rd panorama item after certain condition occured. When I debug code,I see visibility=Visible is executed but then also these 2 items are in collapsed state only.What may be the reason?
<phone:PanoramaItem Header="enterprise" Visibility="Collapsed"
HeaderTemplate="{StaticResource PanoramaItemHeaderTemplate}"
Name="enterpriseApps">
<Grid Margin="16,0,0,0">
<!--<StackPanel>-->
<Grid.RowDefinitions>
<RowDefinition Height="auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<!--<Button x:Name="btnUpdate" Click="btnUpdateAll_Click" Content="Update Apps"
FontSize="30" HorizontalAlignment="Left" Visibility="Collapsed"
Grid.Row="0" Margin="-10 -10 0 0"/>-->
<ListBox x:Name="EnterpriseApplist" Grid.Row="1"
ItemsSource="{Binding EnterpriseAppList}"
ItemTemplate="{StaticResource AvailableAppDataTemplate}"
SelectionChanged="InstalledCompanyAppList_SelectionChanged"/>
<TextBlock Name="txtEnterpriseapps" Visibility="Collapsed" Grid.Row="1"/>
</Grid>
</phone:PanoramaItem>
<phone:PanoramaItem Header="uat" Visibility="Collapsed"
HeaderTemplate="{StaticResource PanoramaItemHeaderTemplate}"
Name="uatApps">
<Grid Margin="16,0,0,0">
<!--<StackPanel>-->
<ListBox x:Name="UATAppList"
ItemsSource="{Binding UATAppList}"
ItemTemplate="{StaticResource AvailableAppDataTemplate}"
SelectionChanged="InstalledCompanyAppList_SelectionChanged">
</ListBox>
<TextBlock Name="txtUatapps" Visibility="Collapsed"/>
<!--</StackPanel>-->
</Grid>
</phone:PanoramaItem>
<phone:PanoramaItem Header="demo" Name="demoApps"
HeaderTemplate="{StaticResource PanoramaItemHeaderTemplate}">
<Grid Margin="16,0,0,0">
<!--<StackPanel>-->
<ListBox x:Name="DemoAppList" Visibility="Collapsed"
ItemsSource="{Binding DemoAppList}"
ItemTemplate="{StaticResource AvailableAppDataTemplate}"
SelectionChanged="InstalledCompanyAppList_SelectionChanged"/>
<TextBlock Name="txtDemoapps" Visibility="Collapsed"/>
<!--</StackPanel>-->
</Grid>
</phone:PanoramaItem>
</phone:Panorama>
In code behind, I am writing as
if (App.ViewModel.EnterpriseAppList.Count == 0)
{
enterpriseApps.Visibility = Visibility.Visible;
if (App.ViewModel.UATAppList.Count == 0)
{
uatApps.Visibility = Visibility.Visible;
}
if (App.ViewModel.DemoAppList.Count == 0)
{
demoApps.Visibility = Visibility.Visible;
}
The Panorama measured it's size and arrange when control Initialize. You can change your method like this(the name of Panorama is panorama):
if (App.ViewModel.EnterpriseAppList.Count == 0)
{
int index1 = panorama.Items.IndexOf(enterpriseApps);
panorama.Items.RemoveAt(index1);
panorama.Items.Insert(index1, enterpriseApps);
enterpriseApps.Visibility = Visibility.Visible;
if (App.ViewModel.UATAppList.Count == 0)
{
int index2 = panorama.Items.IndexOf(uatApps);
panorama.Items.RemoveAt(index2);
panorama.Items.Insert(index2, uatApps);
uatApps.Visibility = Visibility.Visible;
}
if (App.ViewModel.DemoAppList.Count == 0)
{
int index3 = panorama.Items.IndexOf(demoApps);
panorama.Items.RemoveAt(index3);
panorama.Items.Insert(index3, demoApps);
demoApps.Visibility = Visibility.Visible;
}
}
Iam working on dataTemplate in windows phone 7. I had customised Listbox with data template. now i need to get the values from the customised listbox. Please check the code is below.
<phone:PhoneApplicationPage.Resources>
<Style x:Key="Image_List" TargetType="ListBox">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="ListBox">
<Grid>
<Rectangle Fill="#FF030403" RadiusY="10" RadiusX="10" Stroke="#1BA1E2" StrokeThickness="2"/>
<ScrollViewer x:Name="ScrollViewer">
<ItemsPresenter Height="Auto"/>
</ScrollViewer>
</Grid>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
</phone:PhoneApplicationPage.Resources>
<ListBox BorderBrush="#1BA1E2" Name="Image_Listbox" Margin="5,53,6,6" Style="{StaticResource Image_List}">
<ListBox.ItemTemplate>
<DataTemplate>
<Border CornerRadius="5" BorderBrush="#1BA1E2" BorderThickness="1" Margin="3,1,0,0" Height="69" Width="445">
<StackPanel Margin="0,0,0,0" Background="Transparent" Orientation="Horizontal" Height="69" Width="400">
<CheckBox Name="Images_Check" Margin="0,0,0,0" Content="" Height="67" HorizontalAlignment="Left"/>
<TextBlock TextAlignment="Left" FlowDirection="LeftToRight" Width="Auto" FontSize="22" Text="{Binding UBindData}" Height="40" />
</StackPanel>
</Border>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Iam getting the UI_Template correctly.the user will check the required Items in the checkbox provided. now i need to get the checked items in my code. can anybody help me out of this? How to get the checked Items and Itemvalue by the user.
Thanks in advance.
I had got solution after a day war.Here it goes.I got solution from nokia developer site. you can get whether checkbox inside datatemplate is checked and its corresponding Textblock value.
//Variables to store the count of checked Checkboxes and their data
public string option_selected = "";
public int check_count = 0;
//SearchElement populates above variables for checkboxes in specified "targeted_control"
public void SearchElement(DependencyObject targeted_control)
{
var count = VisualTreeHelper.GetChildrenCount(targeted_control); // targeted_control is the listbox
if (count > 0)
{
for (int i = 0; i < count; i++)
{
var child = VisualTreeHelper.GetChild(targeted_control, i);
if (child is CheckBox) // specific/child control
{
CheckBox targeted_element = (CheckBox)child;
if (targeted_element.IsChecked == true)
{
if (targeted_element.Tag!= null)
{
// get the value associated with the "checked" checkbox
option_selected = targeted_element.Tag.ToString();
}
// count the number of "Checked" checkboxes
//check_count = check_count + 1;
return;
}
}
else
{
SearchElement(child);
}
}
}
else
{
return;
}
}
I have two ListPicker. I have bound lpkfamilymemberfrom database and lpkpaymentmode from array value.I want to two as FullScreen mode and in full screen I want item font size 40. In
lpkfamilymemberfrom I achieve font size 40 as I have done following code.But I dont know how to achive this for lpkpaymentmode becoze it has not any datatemplate becoz I bound it using Array.
<DataTemplate x:Name="PickerFullModeItemTemplate">
<StackPanel Orientation="Horizontal" Margin="16 21 0 20">
<TextBlock Text="{Binding Name}" Margin="16 0 0 0" FontSize="43" FontFamily="{StaticResource PhoneFontFamilyLight}"/>
</StackPanel>
</DataTemplate>
<toolkit:ListPicker Background="White" FontSize="44" ExpansionMode="FullScreenOnly" x:Name="lpkpaymentmode"/>
<toolkit:ListPicker ItemTemplate="{StaticResource PickerItemTemplate}" Background="White" FullModeItemTemplate="{StaticResource PickerFullModeItemTemplate}" ExpansionMode="FullScreenOnly" x:Name="lpkfamilymember"/>
And Binding Code:
String[] Mode = { "Cash", "Credit Card", "Debit Card","Net Banking" };
InitCustomPickerDialog();
this.lpkpaymentmode.ItemsSource = Mode;
this.lpkfamilymember.ItemsSource = GetfamilyList();
public IList<FamilyVO> GetfamilyList()
{
// Fetching data from local database
IList<FamilyVO> FamilyList = null;
using (ExpenseDataContext Empdb = new ExpenseDataContext(strConnectionString))
{
IQueryable<FamilyVO> ExpQuery = from Exp in Empdb.Family select Exp;
FamilyList = ExpQuery.ToList();
}
return FamilyList;
}
I have tried many code to set item size of lpkpaymentmode to 40 in full mode but every time it show some fix size which did not change.
How about this:
<DataTemplate x:Name="ItemTemplateForPayment">
<TextBlock Text="{Binding }" Margin="16 0 0 0" FontSize="40" FontFamily="{StaticResource PhoneFontFamilyLight}"/>
</DataTemplate>
And then applying like this:
<toolkit:ListPicker ItemTemplate="{StaticResource PickerItemTemplate}" Background="White" FullModeItemTemplate="{StaticResource ItemTemplateForPayment}" ExpansionMode="FullScreenOnly" x:Name="lpkpaymentmode"/>