I need a pivot page that in every pivot page there is a longlistselector to list the data...
this is the code that i write when i create a simple pivot page
<phone:PivotItem Header="all">
<phone:LongListSelector Name="AllNotes"
Background="Black"
Margin="0,0,0,0">
<phone:LongListSelector.ItemTemplate>
<DataTemplate>
<StackPanel Background="White"
Margin="0,17,0,0">
<TextBlock Text="aaaa">
</TextBlock>
</StackPanel>
</DataTemplate>
</phone:LongListSelector.ItemTemplate>
</phone:LongListSelector>
</phone:PivotItem>
but there isn't anything in the pivot item
i mean by defining a data template and then a stackpanel, there is nothing shown in the pivot item
can you help me ti figure out whats happening exactly?
here is my binding code
<phone:Pivot Title="MY NOTEPAD"
Background="DarkCyan">
<!-- All Notes -->
<phone:PivotItem Header="all">
<phone:LongListSelector Name="FirstListBox"
ItemsSource="{Binding AllNotes}"
Background="Black"
Margin="0,0,0,0">
<phone:LongListSelector.ItemTemplate>
<DataTemplate>
<StackPanel Margin="0,17,0,0">
<TextBlock Text="{Binding Title}"
TextWrapping="Wrap"/>
<TextBlock Text="{Binding Memory}"
TextWrapping="Wrap"/>
</StackPanel>
</DataTemplate>
</phone:LongListSelector.ItemTemplate>
</phone:LongListSelector>
</phone:PivotItem>
now what you think about it?
I finally solve this problem in the way that I don't believe it!
The answer is that we have to start writing the application in the base of Pivot Application !!!
That I don't believe this in the first place!
But Thank You Anyway :)
Related
I have troubles with binding data to a Listbox to dynamically create ExpanderView.
I have used Listboxes in my Code before, so I'm not sure if the binding is really the problem. Am I setting the contents of ExpanderView wrong?
My Code so far in XAML:
<ListBox x:Name="Newsticker_Listbox">
<ListBox.ItemTemplate>
<DataTemplate>
<toolkit:ExpanderView Header="{Binding}" Expander="{Binding}" ItemsSource="{Binding}"
HeaderTemplate="{StaticResource CustomHeaderTemplate}"
ExpanderTemplate="{StaticResource CustomExpanderTemplate}"
ItemTemplate="{StaticResource CustomItemTemplate}" />
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
the Templates:
<!--newsfeed templates-->
<phone:PhoneApplicationPage.Resources>
<DataTemplate x:Key="CustomHeaderTemplate">
<TextBlock Text="{Binding Title}" />
</DataTemplate>
<DataTemplate x:Key="CustomExpanderTemplate">
<Image Source="{Binding Subtitle}" />
</DataTemplate>
<DataTemplate x:Key="CustomItemTemplate">
<TextBlock Text="{Binding Title}" />
</DataTemplate>
</phone:PhoneApplicationPage.Resources>
I'm binding with
ObservableCollection<news> newslist = new ObservableCollection<news>();
//populate
Newsticker_Listbox.ItemsSource = newslist;
news is a really simple object, it just stores some strings, which can be read out by news.Title, news.Subtitle etc
I've used the example from http://www.geekchamp.com/articles/expand-and-collapse-expanderview-inside-data-bound-listbox-via-code as basic for my code, I've just simplified it for my cause (mabye too much?)
Help is very appreciated, thank you all in advance
EDIT
This code works so far, but why does the solution with templates not work?
<ListBox x:Name="Newsticker_Listbox">
<ListBox.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="auto"/>
<RowDefinition Height="10"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
</Grid.ColumnDefinitions>
<toolkit:ExpanderView>
<toolkit:ExpanderView.Header>
<TextBlock Text="{Binding Titel}" />
</toolkit:ExpanderView.Header>
<toolkit:ExpanderView.Expander>
<TextBlock Text="{Binding Untertitel}" />
</toolkit:ExpanderView.Expander>
<toolkit:ExpanderView.Items>
<TextBlock Text="{Binding Text}" />
</toolkit:ExpanderView.Items>
</toolkit:ExpanderView>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
Remove your Header={Binding} and Expander={Binding} XAML code. It is overriding your custom HeaderTemplate and ExpanderTemplate.
You bound the Header and the Expander to the context of the application, which it doesn't really understand, so the binding resolved itself to nothing, so your ExpanderView displays nothing.
I am working on a phone project which requires a pivot page.
I need to change the foreground and fontsize of PivotItem Headers. nothing changes when I tried to code them in xaml
<phone:PivotItem Header="item1" Foreground="black" fontsize="25" >
do I have to use style for them?
You need to change the HeaderTemplate
For example like this:
<controls:Pivot.HeaderTemplate>
<DataTemplate>
<StackPanel Margin="0">
<TextBlock FontSize="25" Margin="0" Text="{Binding}"/>
</StackPanel>
</DataTemplate>
</controls:Pivot.HeaderTemplate>
<controls:PivotItem Header="item1">
</controls:PivotItem>
you can try like this ..
in this i have shown how to make a header of one item you can do this for rest of the others
<phone:Pivot Title="MY APPLICATION">
<!--Pivot item one-->
<phone:PivotItem >
<phone:PivotItem.Header>
<StackPanel Background="#132d63" HorizontalAlignment="Stretch" VerticalAlignment="Stretch">
<TextBlock Text="hhaha" FontSize="35" Foreground="White" Padding="10,10,10,10" />
</StackPanel>
</phone:PivotItem.Header>
</phone:PivotItem>
</phone:Pivot>
I would like to change the background of my grid to white when you hover over or select it. I'd also like to change the color of the text inside at the same time to black. This is specific to one page only, so it would need to be applied with an XKey or something as a guess. The grid starts with a transparent background, also.
I'm really struggling to find the direction for this. Please let me know if you have any ideas or links!
Here's my code:
<GridView.ItemTemplate>
<DataTemplate>
<Grid VerticalAlignment="Top" HorizontalAlignment="Left" Width="335" Height="152">
<StackPanel Orientation="Horizontal" Margin="2,2,2,2" VerticalAlignment="Top" HorizontalAlignment="Left">
<StackPanel Margin="13,0,13,0" Orientation="Vertical" VerticalAlignment="Top" HorizontalAlignment="Left">
<StackPanel Orientation="Horizontal" VerticalAlignment="Bottom">
<TextBlock Style="{StaticResource SmallText}" Text="{Binding Town}" />
<TextBlock Style="{StaticResource SmallText}" Text=", "/>
<TextBlock Style="{StaticResource SmallText}" Text="{Binding State}"/>
<TextBlock Style="{StaticResource SmallText}" Text=", "/>
<TextBlock Style="{StaticResource SmallText}" Text="{Binding Postcode}"/>
</StackPanel>
</StackPanel>
</StackPanel>
</Grid>
</DataTemplate>
</GridView.ItemTemplate>
Thanks for any help.
It seems like you would probably want to modify your GridView's ItemContainerStyle and change its background and visual states to match your requirements. Check my answer to an earlier question related to restyling items here to learn how to extract and modify these styles and templates.
Hi I am trying to get my UI have scrolling in partial page having a list. Here's my code -
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="10,0,14,10">
<StackPanel>
<StackPanel Orientation="Horizontal">
<TextBox x:Name="searchTerm" Text="potato" Width="379" />
<Button x:Name="btnSearch" Content="Go" Click="btnSearch_Click" />
</StackPanel>
<TextBlock x:Name="noResultsTxt" Visibility="Collapsed" Margin="10, 30, 0, 0" Text="No results found! try different search term" Style="{StaticResource PhoneTextNormalStyle}" />
<ScrollViewer Height="520" Width="Auto" ScrollViewer.HorizontalScrollBarVisibility="Auto" VerticalScrollBarVisibility="Auto">
<StackPanel>
<ListBox x:Name="itemlist" SelectionChanged="itemlist_SelectionChanged" Margin="0,10,0,0" >
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Margin="10" >
<TextBlock Text="{Binding Title}" FontSize="35" FontWeight="Normal"/>
<TextBlock Text="{Binding CommaCategories}" FontSize="20" FontWeight="Light" FontStyle="Italic"/>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</StackPanel>
</ScrollViewer>
</StackPanel>
</Grid>
Doesnt seem to be scrolling at the List area. i seem to have figured out that the issue is with Scrollviewer not able to interact where ListBox exists. I verified that the scrolling is happening perfectly fine by setting IsHitTestVisible property of ListBox to be false.
Can someone help me out!
Answering my own question! Just as AMR commented it, I figured out that I don't need the scroll viewer, I just set the height of ListBox and scrolling worked fine! :)
On why external scrollviewer wont work with Listbox - https://stackoverflow.com/a/1294786/729032
Here is the XAML:
<ListBox ItemsSource="{Binding Documents}" BorderBrush="{x:Null}">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock Text="{Binding Title}" FontSize="12" FontWeight="Bold" />
<TextBlock Text="{Binding ID}" FontSize="10" FontStyle="Italic" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
<ListBox.ContextMenu>
<ContextMenu ItemsSource="{Binding CategoryList}">
<ContextMenu.ItemTemplate>
<DataTemplate>
<MenuItem Command="{Binding AddDocumentToCategoryContextMenuCommand}" Header="{Binding Category.Name}" />
</DataTemplate>
</ContextMenu.ItemTemplate>
</ContextMenu>
</ListBox.ContextMenu>
</ListBox>
Ok so the ListBox's ItemSource is bound to the Documents collection in the VM and properly renders the Titles and IDs
The Context Menu's ItemSource is bound to the CategoryList collection in the VM and properly renders the list of categories.
The problem I have is with the Command Binding:
Command="{Binding AddDocumentToCategoryContextMenuCommand}"
Since the ItemSource for the ContextMenu is already set, it tries to get the AddDocumentToCategoryContextMenuCommand from CategoryList. Obviously the command is not there, it is a member of the VM.
I do not want any references to the VMs or Models in the XAML. Everything is constructed using Unity and VM-View is associated in App.xaml:
<Application.Resources>
<DataTemplate DataType="{x:Type vms:FeedViewModel}">
<views:FeedView/>
</DataTemplate>
<DataTemplate DataType="{x:Type vms:DocumentsViewModel}">
<views:DocumentsView/>
</DataTemplate>
<DataTemplate DataType="{x:Type vms:ManagementViewModel}">
<views:ManagementView/>
</DataTemplate>
<DataTemplate DataType="{x:Type dev:DevelopmentViewModel}">
<dev:DevelopmentView />
</DataTemplate>
</Application.Resources>
How can I databind to a member of the VM from within the ContextItem.
Thanks.
UPDATED edit #1 starts Here
Here is the updated xaml (but still not working but some insight gained):
<ListBox ItemsSource="{Binding Documents}" x:Name="Results" BorderBrush="{x:Null}">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Vertical">
<TextBlock Text="{Binding Title}" FontSize="12" FontWeight="Bold" />
<TextBlock Text="{Binding ID}" FontSize="10" FontStyle="Italic" />
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
<ListBox.ContextMenu>
<ContextMenu ItemsSource="{Binding CategoryList}">
<ContextMenu.ItemTemplate>
<DataTemplate>
<MenuItem Command="{Binding ElementName=Results, Path=DataContext.AddDocumentToCategoryContextMenuCommand}" Header="{Binding Category.Name}" />
</DataTemplate>
</ContextMenu.ItemTemplate>
</ContextMenu>
</ListBox.ContextMenu>
</ListBox>
I have this example working for a simple example that does not use a ContextMenu. It appears that the ContextMenu (even though attached to the ListBox) is not part of the user control visual tree. The binding always comes back null / not found. I think the ContextMenu, because it is a floating "window" is constructed in its own tree and therefore cannot find the ListBox call "Results" in order to access the ListBox's DataContext.
Any thoughts on this? Any recommendations on how deal with?
Edit #2 Starts Here
In case you are are wondering, figured out the answer to the binding question:
This binding works:
Command="{Binding RelativeSource={RelativeSource AncestorType=ContextMenu}, Path=PlacementTarget.DataContext.AddDocumentToCategoryContextMenuCommand}
Hope this helps others with the same question.
One last update for completeness.
In order for the command to know which context menu item was clicked on, I had to change the xaml slightly (silly oversight):
<ListBox.ContextMenu>
<ContextMenu x:Name="Context" ItemsSource="{Binding CategoryList}">
<ContextMenu.ItemTemplate>
<DataTemplate>
<MenuItem Command="{Binding RelativeSource={RelativeSource AncestorType=ContextMenu}, Path=PlacementTarget.DataContext.AddDocumentToCategoryContextMenuCommand}"
CommandParameter="{Binding Category.ID}"
Header="{Binding Category.Name}" />
</DataTemplate>
</ContextMenu.ItemTemplate>
</ContextMenu>
</ListBox.ContextMenu>
Again, hope this helps others.
Use the ElementName property of the binding to specify that. You'd end up with something like this:
Command="{Binding ElementName=ViewModelObject
Path=AddDocumentToCategoryContextMenuCommand}"