I am trying to get some design data in blend expressions for my wp7 app but after a certain point it seems to just lose the data and shows me nothing
As you can see I see nothing in the rectangle error even though there is a hardcoded value in it.
<Grid x:Name="LayoutRoot"
Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<!--ContentPanel - place additional content here-->
<Grid x:Name="ContentGrid"
Grid.Row="1">
<ListBox x:Name="lbMovieCollection" ItemsSource="{Binding MovieCollections}">
<ListBox.Resources>
<DataTemplate x:Key="lbMovieCollectionItemTemplate">
<toolkit:ExpanderView x:Name="expMovieCollection" ItemsSource="{Binding Movies}" Header="{Binding Mode=OneWay}" Width="480">
<toolkit:ExpanderView.Resources>
<DataTemplate x:Key="expMovieCollectionHeaderTemplate">
<TextBlock TextWrapping="Wrap" Text="{Binding Name}" Height="50"/>
</DataTemplate>
<DataTemplate x:Key="expMovieCollectionItemTemplate">
<ListBoxItem HorizontalAlignment="Left" toolkit:TiltEffect.IsTiltEnabled="True" d:LayoutOverrides="VerticalAlignment">
<StackPanel Height="61" Width="371" >
<TextBlock TextWrapping="Wrap" Text="THIS IS HARCDOED" FontSize="29.333" />
</StackPanel>
</ListBoxItem>
</DataTemplate>
</toolkit:ExpanderView.Resources>
<toolkit:ExpanderView.ItemTemplate>
<StaticResource ResourceKey="expMovieCollectionItemTemplate"/>
</toolkit:ExpanderView.ItemTemplate>
<toolkit:ExpanderView.HeaderTemplate>
<StaticResource ResourceKey="expMovieCollectionHeaderTemplate"/>
</toolkit:ExpanderView.HeaderTemplate>
</toolkit:ExpanderView>
</DataTemplate>
</ListBox.Resources>
<ListBox.ItemTemplate>
<StaticResource ResourceKey="lbMovieCollectionItemTemplate"/>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
</Grid>
Looks like your "THIS IS HARCDOED" values are hidden inside the collapsed portion of toolkit:ExpanderView control.
Related
I have a GridView that displays Header and Sub-Items like so:
<GridView ItemsSource="{Binding Path=MainViewModels}">
<GridView.ItemTemplate>
<DataTemplate>
<Grid VerticalAlignment="Top">
<Grid.RowDefinitions>
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Border BorderBrush="White" BorderThickness="1"></Border>
<Grid VerticalAlignment="Top" HorizontalAlignment="Left">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Border Grid.Row="0" BorderBrush="White" BorderThickness="1"></Border>
<TextBlock Grid.Row="0"
HorizontalAlignment="Left"
Foreground="#FFAAAAAA"
Style="{StaticResource Style_TextBlock_Label_H3}"
Text="{Binding Path=Description}" VerticalAlignment="Top" />
<GridView Grid.Row="1"
ItemsSource="{Binding Path=SubViewModels}">
<GridView.ItemTemplate>
<DataTemplate>
<TextBlock Margin="0,0,5,0"
Text="{Binding Path=Description}"
TextWrapping="Wrap" />
</DataTemplate>
</GridView.ItemTemplate>
<GridView.ItemsPanel>
<ItemsPanelTemplate>
<WrapGrid Orientation="Vertical" VerticalAlignment="Stretch" />
</ItemsPanelTemplate>
</GridView.ItemsPanel>
</GridView>
</Grid>
</Grid>
</DataTemplate>
</GridView.ItemTemplate>
<GridView.ItemsPanel>
<ItemsPanelTemplate>
<StackPanel Orientation="Horizontal"
VerticalAlignment="Top">
</StackPanel>
</ItemsPanelTemplate>
</GridView.ItemsPanel>
</GridView>
However, whenever it renders, it renders like this:
What I want to achieve is that all the "Header" are on the top, while the Items themselves extend to the bottom and then just overflow using the WrapGrid.
Can please point out where I am going wrong?
Thank you!
I am trying to use a but am getting the error:
The property 'Content' is set more than once.
It dissappears if I remove any one of the two lines of code in between the tags.
So neither of them seems wrong individually, but both together cause the problem.
<Grid x:Name="LayoutRoot" Background="Transparent">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
<!--TitlePanel contains the name of the application and page title-->
<StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">
<TextBlock x:Name="ApplicationTitle" Text="New Trip" Style="{StaticResource PhoneTextNormalStyle}" Height="40" />
<Button Content="Back" Height="71" Name="button1" Width="103" HorizontalContentAlignment="Stretch" VerticalAlignment="Top" HorizontalAlignment="Right" Click="button1_Click" />
</StackPanel>
<!--ContentPanel - place additional content here-->
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
<ScrollViewer>
<TextBlock Height="60" HorizontalAlignment="Left" Margin="65,12,0,0" Name="textBlock1" Text="Username" VerticalAlignment="Top" Width="169" />
<TextBox Height="78" HorizontalAlignment="Left" Margin="60,60,0,0" Name="textBoxUsername" VerticalAlignment="Top" Width="274" />
</ScrollViewer>
</Grid>
</Grid>
ScrollViewer can only have 1 content, so wrap the controls inside the ScrollViewer in a container like Grid, DockPanel, StackPanel
<ScrollViewer>
<StackPanel>
<TextBlock Height="60" HorizontalAlignment="Left" Margin="65,12,0,0" Name="textBlock1" Text="Username" VerticalAlignment="Top" Width="169" />
<TextBox Height="78" HorizontalAlignment="Left" Margin="60,60,0,0" Name="textBoxUsername" VerticalAlignment="Top" Width="274" />
</StackPanel>
</ScrollViewer>
Put your <TextBlock> and <TextBox> within another container, such as a StackPanel.
In expression blend I created a sample data source in visual editor. In case of using a listbox I simply drag the collection there and data is automatically shown.
Now, I am interested to retrieve data from datasource from code behind. Is this possible?
There are a couple ways to do this, I will give you the simplest. I have a ListPicker that is bascially the same as a ListBox: Here is my ListPicker markup: Also here is a link
<toolkit:ListPicker Name="lpDrag" Grid.Row="4" Grid.Column="1" Loaded="lptest_Loaded" SelectedIndex="0">
<toolkit:ListPicker.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding name}" />
</StackPanel>
</DataTemplate>
</toolkit:ListPicker.ItemTemplate>
<toolkit:ListPicker.FullModeItemTemplate>
<DataTemplate>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="50" ></ColumnDefinition>
<ColumnDefinition ></ColumnDefinition>
</Grid.ColumnDefinitions>
<TextBlock Text="{Binding name}" FontSize="26" Grid.Column="0" Grid.Row="0"/>
<TextBlock Text="{Binding desc}" TextWrapping="Wrap" FontSize="26" Grid.Column="1" Grid.Row="0" />
</Grid>
</DataTemplate>
</toolkit:ListPicker.FullModeItemTemplate>
</toolkit:ListPicker>
Here is the code behind:
lpDrag.ItemsSource = //Whatever your datasource is
I have a ItemTemplate like this
<ListBox>
<ListBox.ItemTemplate>
<DataTemplate>
<Grid>
<Grid.RowDefinitions>
<RowDefinition />
<RowDefinition />
</Grid.RowDefinitions>
<Button Grid.Row="0">
<Button.Template>
<ControlTemplate>
<Border BorderBrush="AntiqueWhite" BorderThickness="1">
<StackPanel Orientation="Horizontal" Background="Gray" Width="465">
<Image Margin="2,0,10,0" Source="{Binding StateImage}" Stretch="None"/>
<TextBlock Name="txt" Text="{Binding DateLabel}"/>
</StackPanel>
</Border>
</ControlTemplate>
</Button.Template>
<Custom:Interaction.Triggers>
<Custom:EventTrigger EventName="Click">
<mx:EventToCommand Command="{Binding VisibilityListboxCommand}"
CommandParameter="{Binding EementName=txt, Path=Text}"
/>
</Custom:EventTrigger>
</Custom:Interaction.Triggers>
</Button>
<ListBox Grid.Column="1" ItemsSource="{Binding WhatsonList, Mode=OneWay}">
<ListBox.ItemTemplate>
<DataTemplate>
<Border BorderBrush="Gray" BorderThickness="0,0,0,1" Padding="0,0,0,10">
<Grid Margin="0,10,0,0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="100"/>
<ColumnDefinition Width="360"/>
</Grid.ColumnDefinitions>
<StackPanel Grid.Column="0">
<Button>
.....
</Button>
<CheckBox Template="{StaticResource CheckboxImageTemplate}" Margin="0,5,0,0"/>
</StackPanel>
<ListBox Grid.Column="1">
.....
</ListBox>
</Grid>
</Border>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
When I click on button inside listboxitem datatemplate I want to get content of textblock txt to find out what listbox item was clicked to trace back index in the List(model) that listbox bind from.
But from commandparameter I cannot get anything because there are many textblock named txt I think.
Please help me !
A better way to solve this is by binding the CommandParameter to 'thing' in the DataContext of the item like this:
<Custom:Interaction.Triggers>
<Custom:EventTrigger EventName="Click">
<mx:EventToCommand Command="{Binding VisibilityListboxCommand}"
CommandParameter="{Binding}" />
</Custom:EventTrigger>
</Custom:Interaction.Triggers>
This way the binding does not rely on a particular control being present and having a specific name.
I have the following XAML markup in a WP7 UserControl. My problem is that when my ListBox has more items than will fit on a page it will not scroll properly. I can scroll the list by panning upwards with my finger but as soon as I remove my finger it jumps back to the top of the list (if the list is very long then the scrolling will not even work to this limited extent).
I have tried numerous different layouts with no success e.g. Wrapping ListBox in ScrollViewer, utilising StackPanel instead of Grid, removing the WrapPanel and replacing it with a grid.
Other similar questions suggested removing StackPanel (which I did but made no difference) or using ScrollViewer (which did not work).
The Page that hosts the UserControl uses a GestureListener - I removed that and it still made no difference.
<Grid x:Name="LayoutRoot"
Background="SteelBlue">
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<!--<TextBlock Grid.Row="0"
Text="Search"
Style="{StaticResource PhoneTextTitle2Style}" />-->
<Grid Grid.Row="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<TextBlock Text="Search Type"
Grid.Column="0"
VerticalAlignment="Center" />
<RadioButton Content="RMB/RSD"
Grid.Column="1"
IsChecked="{Binding Path=SearchType, Converter={StaticResource enumBooleanConverter}, ConverterParameter=RMB, Mode=TwoWay}" />
<RadioButton Content="Name"
Grid.Column="2"
IsChecked="{Binding Path=SearchType, Converter={StaticResource enumBooleanConverter}, ConverterParameter=Name, Mode=TwoWay}" />
</Grid>
<Grid Grid.Row="1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<TextBlock Text="Search Term"
Grid.Column="0"
VerticalAlignment="Center" />
<TextBox Grid.Column="1"
Text="{Binding SearchTerm, Mode=TwoWay}"
InputScope="{Binding SearchTermInputScope}">
<i:Interaction.Behaviors>
<b:SelectAllOnFocusBehavior />
</i:Interaction.Behaviors>
</TextBox>
</Grid>
<Button Grid.Row="2"
Content="Find"
cmd:ButtonBaseExtensions.Command="{Binding FindDeliveryPointsCommand}" />
<ListBox Grid.Row="3"
ItemsSource="{Binding SearchResults}"
ScrollViewer.VerticalScrollBarVisibility="Auto">
<ListBox.ItemTemplate>
<DataTemplate>
<toolkit:WrapPanel Orientation="Horizontal"
Width="480"
Background="{Binding RMB, Converter={StaticResource alternateColorConverter}}">
<TextBlock Text="{Binding RMB}"
FontSize="26"
Foreground="Navy"
Padding="5"
Width="60" />
<TextBlock Text="{Binding HouseholdName}"
FontSize="26"
Foreground="Navy"
Padding="5"
Width="420" />
<TextBlock Text="{Binding StreetWithRRN}"
FontSize="26"
Foreground="Navy"
Padding="5" />
<TextBlock Text="{Binding Street.Locality.Name}"
FontSize="26"
Foreground="Navy"
Padding="5" />
</toolkit:WrapPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
Specify ListBox.Height - something like Height="200". As it is now, ListBox expands automatically to accomodate all loaded items and it grows out of the screen. As a result you get large page with no scroller.
When you add ListBox.Height, the ListBox area won't grow. Instead ListBox ScrollViewer will be activated and you'll get the effect you need.
I use databinding when the ListBox's Height changed depending on the other controls on the page.
<StackPanel x:Name="ContentPanel" Grid.Row="1">
<ListBox x:Name="LstSample" Height="{Binding ElementName=ContentPanel, Path=ActualHeight}">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal">
<Image Source="{Binding ImagePath}" Stretch="None"/>
<StackPanel Orientation="Vertical">
<TextBlock Text="{Binding Name}" FontSize="45"/>
<TextBlock Text="{Binding Group}" FontSize="25"/>
</StackPanel>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</StackPanel>