I have a listBox with a checkbox I want to manage the alignment through setting the vertical alignment.
I have seen several solution here e.g. set verticalContentAlignment or verticalAlignment to top but that didn't work.
I've also seen some setting a style but couldn't manage to make it done.
What I'd like is to know WHY the ONLY element is down there. I can't understand why it's stuck in the middle.
Here's my code:
<ListBox x:Name="lb2Tab3" HorizontalContentAlignment="Stretch" FontSize="{StaticResource BUTTON_FONTSIZE}" Background="{x:Null}" BorderBrush="{x:Null}" Margin="0,0,0.8,0" >
<CheckBox x:Name="cbEasyRunManagesPcDmis" Margin="20" Content="EasyRun Manages PC-DMIS" HorizontalAlignment="Left" VerticalAlignment="Top" Click="cbTouchScreen_Click" />
</ListBox>
thanx for any help
Patrick
--- EDIT ---
As requested by Frisbee here is the complete xaml. Sorry for its length:
<Base:WindowViewBase x:Class="EasyRun.Views.MainView.MainView"
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"
mc:Ignorable="d"
xmlns:Base="clr-namespace:Cannoli.Base;assembly=Cannoli"
xmlns:design="clr-namespace:EasyRun.Views.MainView.Design"
xmlns:i="http://schemas.microsoft.com/expression/2010/interactivity"
xmlns:System="clr-namespace:System;assembly=mscorlib"
xmlns:CannoliBorderlessWindow="clr-namespace:CannoliBorderlessWindow;assembly=Cannoli.BorderlessWindow"
d:DesignWidth="212.32" d:DesignHeight="109.92"
Title="EASY RUN 2.0" Height="600" Width="900" MinWidth="500" FontFamily="/EasyRun2.0;component/Resources/Fonts/#FontAwesome" Icon="/EasyRun2.0;component/Resources/Images/Lightning.png"
>
<d:WindowViewBase.DataContext>
<design:DesignMainViewModel />
</d:WindowViewBase.DataContext>
<i:Interaction.Behaviors>
<CannoliBorderlessWindow:CannoliBorderlessWindowBehavior/>
</i:Interaction.Behaviors>
<!-- RISORSE GLOBALI: VARIABILI -->
<Window.Resources>
<System:Double x:Key="BUTTON_HEIGHT">50</System:Double>
<System:Double x:Key="BUTTON_FONTSIZE">20</System:Double>
</Window.Resources>
<Grid x:Name="MainGrid">
<Grid.Background>
<ImageBrush ImageSource="/EasyRun2.0;component/Resources/Images/gradientWallpaper.jpg"/>
</Grid.Background>
<TextBlock Text="{Binding WelcomeMessage}" HorizontalAlignment="Center" VerticalAlignment="Center" FontWeight="Bold" Margin="428,128,99.6,228"/>
<StackPanel Orientation="Vertical" VerticalAlignment="Bottom" Margin="0,0,0,20">
</StackPanel>
<TabControl TabStripPlacement="Left" Margin="0,0,-0.4,0" Background="{x:Null}">
<!-- +++++++++++++ TAB1 ++++++++++++ -->
<TabItem Name="tabItem1" HorizontalAlignment="Center" Height="80" FontSize="50" Background="{x:Null}" VerticalAlignment="Top" >
<TabItem.Header>
<StackPanel>
<TextBlock HorizontalAlignment="Center" Text=""/>
<TextBlock Name="tbTab1" HorizontalAlignment="Center" Visibility="Hidden" FontSize="20"/>
</StackPanel>
</TabItem.Header>
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Border x:Name="Border1Tab1" BorderBrush="Gainsboro" BorderThickness="5" Width="200" CornerRadius="8,8,3,3" Margin="10,10,10,10.4" >
<ListBox x:Name="lbButtons1" Background="{x:Null}" BorderBrush="{x:Null}" Margin="10,10,10,10" />
</Border>
<Border x:Name="Border2Tab1" BorderBrush="Gainsboro" MinWidth="100" BorderThickness="5" CornerRadius="8,8,3,3" Grid.Column="1" Margin="10,10,9.2,10" />
</Grid>
</TabItem>
<!-- +++++++++++++ TAB2 ++++++++++++ -->
<TabItem Name="tabItem2" HorizontalAlignment="Center" Height="80" FontSize="50">
<TabItem.Header>
<StackPanel>
<TextBlock Text=""/>
<TextBlock Name="tbTab2" Visibility="Hidden" FontSize="20"/>
</StackPanel>
</TabItem.Header>
<TabItem.Background>
<ImageBrush/>
</TabItem.Background>
</TabItem>
<!-- +++++++++++++ TAB3 ++++++++++++ -->
<TabItem Name="tabItem3" HorizontalAlignment="Center" Height="80" FontSize="50" Background="{x:Null}" >
<TabItem.Header>
<StackPanel>
<TextBlock Text="" HorizontalAlignment="Center" />
<TextBlock Name="tbTab3" Visibility="Hidden" FontSize="20"/>
</StackPanel>
</TabItem.Header>
<Grid >
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Border x:Name="Border1Tab3" BorderBrush="Gainsboro" BorderThickness="5" Width="200" CornerRadius="8,8,3,3" Margin="10,10,10,10" >
<ListBox x:Name="lbButtons3" FontSize="{StaticResource BUTTON_FONTSIZE}" HorizontalContentAlignment="Stretch" Background="{x:Null}" BorderBrush="{x:Null}" >
<Button Name="bt1Tab3" Background="{x:Null}" Content="1" Click="Button_Click" />
<Button Name="bt2Tab3" Background="{x:Null}" Height="{StaticResource BUTTON_HEIGHT}" Content="2" Click="Button_Click"/>
<Button Name="bt3Tab3" Background="{x:Null}" Height="{StaticResource BUTTON_HEIGHT}" Content="3" Click="Button_Click"/>
<Button Name="bt4Tab3" Background="{x:Null}" Height="{StaticResource BUTTON_HEIGHT}" Content="4" Click="Button_Click"/>
<Button Name="bt5Tab3" Background="{x:Null}" Height="{StaticResource BUTTON_HEIGHT}" Content="5" Click="Button_Click"/>
<Button Name="bt6Tab3" Background="{x:Null}" Height="{StaticResource BUTTON_HEIGHT}" Content="6" Click="Button_Click"/>
<Button Name="bt7Tab3" Background="{x:Null}" Height="{StaticResource BUTTON_HEIGHT}" Content="7" Click="Button_Click"/>
<Button Name="bt8Tab3" Background="{x:Null}" Height="{StaticResource BUTTON_HEIGHT}" Content="8" Click="Button_Click"/>
</ListBox>
</Border>
<Border x:Name="Border2Tab3" BorderBrush="Gainsboro" MinWidth="100" BorderThickness="5" CornerRadius="8,8,3,3" Grid.Column="1" Margin="10,10,10,10" >
<StackPanel >
<ListBox x:Name="lb1Tab3" HorizontalContentAlignment="Stretch" FontSize="{StaticResource BUTTON_FONTSIZE}" Background="{x:Null}" BorderBrush="{x:Null}" Margin="0,0,0.4,0" d:IsHidden="True" >
<StackPanel Orientation="Horizontal">
<TextBlock x:Name="lbLanguage" Margin="20" HorizontalAlignment="Left" TextWrapping="Wrap" VerticalAlignment="Center" TextAlignment="Center" Grid.Row="1"><Run Text="Language"/></TextBlock>
<ComboBox x:Name="cmbLanguages" Margin="20" HorizontalAlignment="Left" VerticalAlignment="Center" Width="246" Height="35" DropDownClosed="cmbLanguages_DropDownClosed"/>
</StackPanel>
<CheckBox x:Name="cbTouchScreen" Margin="20" Content="Use touch screen" HorizontalAlignment="Left" VerticalAlignment="Top" Click="cbTouchScreen_Click" />
<CheckBox x:Name="cbEnableImages" Margin="20" Content="Enable Images" HorizontalAlignment="Left" VerticalAlignment="Top" />
<StackPanel Name="spImageDimension" Orientation="Horizontal">
<TextBlock x:Name="lbImageDimension" Margin="20" HorizontalAlignment="Left" TextWrapping="Wrap" VerticalAlignment="Center" TextAlignment="Center"><Run Text="Image dimension"/></TextBlock>
<ComboBox x:Name="cmbImageDimension" Margin="20" Text="250 px" HorizontalAlignment="Left" DropDownClosed="cmbImageDimension_DropDownClosed" VerticalAlignment="Center" Width="246" Height="35" IsEditable="True">
<TextBlock ><Run Text="50 px"/></TextBlock>
<TextBlock ><Run Text="100 px"/></TextBlock>
<TextBlock ><Run Text="150 px"/></TextBlock>
<TextBlock ><Run Text="200 px"/></TextBlock>
<TextBlock ><Run Text="250 px"/></TextBlock>
</ComboBox>
</StackPanel>
</ListBox>
<ListBox x:Name="lb2Tab3" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Top" FontSize="{StaticResource BUTTON_FONTSIZE}" Background="{x:Null}" BorderBrush="{x:Null}" Margin="0,0,0.8,0" >
<CheckBox x:Name="cbEasyRunManagesPcDmis" Margin="20" Content="EasyRun Manages PC-DMIS" HorizontalAlignment="Left" VerticalAlignment="Top" Click="cbTouchScreen_Click" />
</ListBox>
<ListBox x:Name="lb3Tab3" HorizontalContentAlignment="Stretch" FontSize="{StaticResource BUTTON_FONTSIZE}" Background="{x:Null}" BorderBrush="{x:Null}" Margin="0,0,0.4,0" />
<ListBox x:Name="lb4Tab3" HorizontalContentAlignment="Stretch" FontSize="{StaticResource BUTTON_FONTSIZE}" Background="{x:Null}" BorderBrush="{x:Null}" Margin="0,0,0.4,0" d:IsHidden="True" >
</ListBox>
<ListBox x:Name="lb5Tab3" HorizontalContentAlignment="Stretch" FontSize="{StaticResource BUTTON_FONTSIZE}" Background="{x:Null}" BorderBrush="{x:Null}" Margin="0,0,0.4,0" d:IsHidden="True" >
</ListBox>
<ListBox x:Name="lb6Tab3" HorizontalContentAlignment="Stretch" FontSize="{StaticResource BUTTON_FONTSIZE}" Background="{x:Null}" BorderBrush="{x:Null}" Margin="0,0,0.4,0" d:IsHidden="True" >
</ListBox>
<ListBox x:Name="lb7Tab3" HorizontalContentAlignment="Stretch" FontSize="{StaticResource BUTTON_FONTSIZE}" Background="{x:Null}" BorderBrush="{x:Null}" Margin="0,0,0.4,0" d:IsHidden="True" >
</ListBox>
<ListBox x:Name="lb8Tab3" HorizontalContentAlignment="Stretch" FontSize="{StaticResource BUTTON_FONTSIZE}" Background="{x:Null}" BorderBrush="{x:Null}" Margin="0,0,0.4,0" d:IsHidden="True" >
</ListBox>
</StackPanel>
</Border>
</Grid>
</TabItem>
</TabControl>
</Grid>
You need to align the ListBox
<ListBox x:Name="lb2Tab3" HorizontalContentAlignment="Stretch"
VerticalContentAlignment="Top"
If that does not work then post more of your XAML
So the problem was related with the fact that there are several listBox one on top of the other. I thought that making them hidden was enough but when I painted the second listBox in black I saw that it was not starting from the top (see image).
So the solution was to set Visibility = Collapsed for all the listbox that are not in use.
Thanks to kirotab for putting me on the right path. Not sure if I can vote your comment.
Related
i want to have a centred popup notifications on my window ( Height="400" Width="500"). See the xaml code below. Is it possible to center it only with xaml (without the code behind)?
</Grid>
<TextBlock Text="TEXT" Grid.Row="1" Grid.Column="0" Grid.RowSpan="2" Grid.ColumnSpan="3" FontSize="200" FontWeight="Bold" HorizontalAlignment="Center"/>
<Grid Grid.Row="1" Grid.Column="1">
<Popup x:Name="PopupName" Grid.ColumnSpan="2" IsOpen="{Binding ElementName=ToggleButton,Path=IsChecked}" StaysOpen="False" Placement="Absolute"
AllowsTransparency="True" PopupAnimation="None" Focusable="False" HorizontalAlignment="Center" VerticalAlignment="Center">
<Grid Height="400" Width="500">
<Rectangle Fill="Silver" Opacity="0.5" Panel.ZIndex="1" Height="400" Width="500"/>
<StackPanel VerticalAlignment="Center" HorizontalAlignment="Center" Panel.ZIndex="2" Height="150" Width="150">
<ListBox Height="Auto" HorizontalAlignment="Center" >
<Label Content="Red" Background="Red" Margin="5" VerticalAlignment="Top"/>
<Label Content="Green" Background="Green" Margin="5" VerticalAlignment="Center"/>
<Label Content="Yellow" Background="Yellow" Margin="5" VerticalAlignment="Bottom"/>
</ListBox>
</StackPanel>
<ToggleButton Panel.ZIndex="2" Background="Coral" Foreground="White" FontWeight="Bold" Name ="Button" Width="80" Height="30" HorizontalAlignment="Center" Margin="5,170,5,5" Content="Close" Click="Button_OnClick"/>
</Grid>
</Popup>
</Grid>
Another option was to use Placement ="AbsolutePoint" with Horizon-/Verticaloffset but it seems like a bit weird :D
Any suggestion? Thx ;)
This should center the Popup in the parent window:
<Popup ...
Placement="Center"
PlacementTarget="{Binding RelativeSource={RelativeSource AncestorType=Window}}" />
I have implemented below mentioned code in WPF in that I have implemented virtualization of lazy loading but it's not work when my inner collection have a 1000 of record then it will take much time to load on screen.
<ListBox x:Name="Mappingcontrol" Grid.Row="1"
DataContext="{Binding ElementName=Grids,Path=DataContext}"
VerticalAlignment="Stretch" HorizontalAlignment="Stretch"
ItemsSource="{Binding Path=MultiMappingCollectionList, Mode=TwoWay}"
VirtualizingStackPanel.IsVirtualizing="True"
VirtualizingStackPanel.VirtualizationMode="Recycling"
BorderThickness="0" BorderBrush="Transparent"
Background="Transparent"
HorizontalContentAlignment="Stretch"
VerticalContentAlignment="Stretch"
ItemContainerStyle="{StaticResource TransparentListBoxStyle}">
<ListBox.ItemTemplate>
<DataTemplate>
<Border Padding="0,10,0,10" BorderThickness="0,0,0,1"
BorderBrush="{StaticResource Gray5SolidBrush}">
<Grid x:Name="Gridmain" Margin="4,0,0,0">
<Grid.ColumnDefinitions>
<ColumnDefinition x:Name="default" Width="0.5*" SharedSizeGroup="default" />
<ColumnDefinition x:Name="atrioValue" Width="1*"
SharedSizeGroup="atrioValue" />
<ColumnDefinition x:Name="externalValue" Width="2*"
SharedSizeGroup="externalValue" />
</Grid.ColumnDefinitions>
<ToggleButton VerticalAlignment="Top"
HorizontalAlignment="Left"
Style="{DynamicResource ToggleButtonStyle}"
Margin="30,12,10,10" IsTabStop="False" Width="25"
Height="25"
IsChecked="{Binding IsDefault, Mode=TwoWay}">
<TextBlock Grid.Column="1" Margin="0,15,10,10" HorizontalAlignment="Left"
VerticalAlignment="Top"
Text="{Binding Path=Description}"
Style="{StaticResource ContentDataText}"
Name="txtDescription" />
<ListBox x:Name="GroupListBox" Grid.Column="2"
ItemsSource="{Binding Path=MultiMapping,Mode=TwoWay}"
HorizontalContentAlignment="Stretch"
BorderThickness="0"
BorderBrush="Transparent"
Background="Transparent"
VerticalContentAlignment="Stretch"
VirtualizingStackPanel.IsVirtualizing="True"
VirtualizingStackPanel.VirtualizationMode="Recycling"
VirtualizingStackPanel.CacheLength="2,3"
VirtualizingStackPanel.CacheLengthUnit="Page"
ItemContainerStyle="{StaticResource TransparentListBoxStyle}">
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel Orientation="Horizontal" CanVerticallyScroll="True" Height="200">
<telerik:RadWatermarkTextBox x:Name="ExternalValueTextBox"
HorizontalAlignment="Left"
TabIndex="100"
KeyboardNavigation.TabIndex="100"
IsTabStop="True"
Width="250"
MaxLength="35"
TextWrapping="Wrap"
Validation.ErrorTemplate="{DynamicResource CustomErrorTemplate}"
Text="{Binding Path=ExternalValue, Mode=TwoWay,UpdateSourceTrigger=PropertyChanged}"
PreviewTextInput="ExternalValueTextBox_OnPreviewTextInput"
Style="{DynamicResource RadWatermarkTextBoxDefault}"
Visibility="{Binding Path=ExternalValue,Converter={StaticResource StarVisibilityConverter}}"
Margin="0,5,0,0">
</telerik:RadWatermarkTextBox>
<Button x:Name="DeleteButton" Background="Transparent"
BorderThickness="0"
BorderBrush="Transparent"
CommandParameter="{Binding}"
Command="{Binding DataContext.RemoveGrouplistCommand, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type UserControl}}}"
HorizontalAlignment="Right"
VerticalAlignment="Center"
Visibility="{Binding Path=RemoveButtonVisibility,Converter={StaticResource BooleanHiddenVisibleConverter},Mode=TwoWay}"
Margin="15,5,15,0"
Style="{DynamicResource ButtonInvisibleNoColorEffects}">
<Button.Content>
<Rectangle Style="{StaticResource SmallCloseIcon}" />
</Button.Content>
</Button>
<Grid x:Name="AddGrid"
Visibility="{Binding Path=AddbuttonVisibility,Converter={StaticResource BooleanVisibilityConverter}}">
<controls:ActionImageButton x:Name="AddButton"
Content="Add Another"
DataContext="{Binding ElementName=Root,Path=DataContext}"
CommandParameter="{Binding ElementName=txtDescription,Path=Text}"
Command="{Binding AddGrouplistCommand}"
HorizontalAlignment="Right"
VerticalAlignment="Center"
IsEnabled="{Binding ElementName=ExternalValueTextBox,Path=Text,Converter={StaticResource StarVisibilityConverter},ConverterParameter=CanAdd}"
Margin="5,5,30,5"
Style="{StaticResource ActionImageButtonMedium}" />
</Grid>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</Grid>
</Border>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
It would be great help if anyone can light on me what's I am doing wrong in it
Thanks in advance.
I have a listbox which is filled up with items taken from a data contract. I want to add a bit of xaml to the top of the listbox which takes data from another data contract. How do i go about doing this?
<phone:PivotItem>
<ScrollViewer>
<StackPanel>
<ListBox x:Name="StatusCommentsList"
Background="Transparent"
ItemsSource="{Binding StatusComments}"
u:ScrollViewerMonitor.AtEndCommand="{Binding FetchMoreStatusCommentsDataCommand}" VerticalContentAlignment="Top">
<!-- THIS DOESNT WORK-->
<ListBoxItem>
<Grid Height="auto">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="67" />
<ColumnDefinition Width="389"/>
</Grid.ColumnDefinitions>
<StackPanel Height="auto" Grid.Column="0" Background="Transparent">
<Border Background="Transparent" BorderThickness="0" Width="62" Height="62" HorizontalAlignment="Left" Margin="0,0,0,5">
<Image Source="{Binding Notification.context.data.created_by.image.thumbnail_link}" Width="62" Height="62"></Image>
</Border>
</StackPanel>
<StackPanel Height="auto" Grid.Column="1" Width="389" MaxWidth="389" Orientation="Vertical" >
<TextBlock TextWrapping="Wrap" Text="{Binding Notification.context.data.created_by.name}" HorizontalAlignment="Stretch" FontSize="30" VerticalAlignment="Center" Margin="0,0,0,5" Foreground="White" Width="389" MaxWidth="389" />
<TextBlock TextWrapping="Wrap" Text="{Binding Notification.context.data.created_on}" HorizontalAlignment="Stretch" FontSize="30" VerticalAlignment="Center" Margin="0,0,0,5" Foreground="White" Width="389" MaxWidth="389" />
<TextBlock TextWrapping="Wrap" Text="{Binding Notification.context.data.rich_value}" HorizontalAlignment="Stretch" FontSize="30" VerticalAlignment="Top" Margin="0,0,0,5" Foreground="White" Width="389" MaxWidth="389" />
</StackPanel>
</Grid>
</ListBoxItem>
<!-- /THIS DOESNT WORK -->
<ListBox.ItemTemplate>
<DataTemplate>
<StackPanel VerticalAlignment="Top" Margin="5,0,0,0">
<Button Style="{StaticResource JamesTransparentButton}" Padding="-5,0,-5,-5" Margin="-7,-12,-7,-7" Height="auto" BorderThickness="0" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" HorizontalContentAlignment="Left" UseLayoutRounding="True" FontSize="0.01">
<Grid Height="auto">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="67" />
<ColumnDefinition Width="389"/>
</Grid.ColumnDefinitions>
<StackPanel Height="auto" Grid.Column="0" Background="Transparent">
<Border Background="Transparent" BorderThickness="0" Width="62" Height="62" HorizontalAlignment="Left" Margin="0,0,0,5">
<Image Source="{Binding created_by.image.thumbnail_link}" Width="62" Height="62"></Image>
</Border>
</StackPanel>
<StackPanel Height="auto" Grid.Column="1" Width="389" MaxWidth="389" Orientation="Vertical" >
<TextBlock Text="{Binding created_by.name}" FontSize="30" VerticalAlignment="Top" Margin="0,0,0,5" Foreground="White" />
<TextBlock Text="{Binding created_on}" FontSize="30" VerticalAlignment="Top" Margin="0,0,0,5" Foreground="White" />
<TextBlock TextWrapping="Wrap" Text="{Binding value}" HorizontalAlignment="Stretch" FontSize="30" VerticalAlignment="Top" Margin="0,0,0,5" Foreground="White" Width="389" MaxWidth="389" />
</StackPanel>
</Grid>
</Button>
</StackPanel>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</StackPanel>
</ScrollViewer>
</phone:PivotItem>
I tried just adding a new item to the listbox but the data contract would mean i have to instantiate all the sub levels of objects and it would suckkk as they are different domains.
Keep in mind that i want the entire screen to scroll in union... so that it looks like one big long list, regardless of the first being like a default value.
Put the first item outside the ListBox and disable ScrollViewer for the ListBox so the whole thing will scroll together. Here's an example where the item is a simple TextBlock. You can change it to suit your requirement.
<ScrollViewer>
<StackPanel Orientation="Vertical">
<TextBlock Text="Item 1"/>
<ListBox ScrollViewer.VerticalScrollBarVisibility="Disabled">
<ListBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding item}"/>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</StackPanel>
</ScrollViewer>
listbox scroller not working properly when i try to scroller Down .This is my code and i am open this page on popup . How to solve this prob . Please Help .thankyou ....................................................................................................................................................................................
<phone:PhoneApplicationPage
x:Class="PdfReader.Views.BookMark"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone"
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
SupportedOrientations="Portrait" Orientation="Portrait"
mc:Ignorable="d"
shell:SystemTray.IsVisible="True" >
<!--LayoutRoot is the root grid where all page content is placed-->
<Grid x:Name="LayoutRoot" Background="Transparent" Height="auto">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="auto"/>
</Grid.RowDefinitions>
<!--TitlePanel contains the name of the application and page title-->
<!--<StackPanel Grid.Row="0" Margin="12,17,0,28">
<TextBlock Text="MY APPLICATION" Style="{StaticResource PhoneTextNormalStyle}"/>
<TextBlock Text="page name" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>
</StackPanel>-->
<!--ContentPanel - place additional content here-->
<Grid x:Name="ContentPanel" Grid.Row="1" Margin="0,0,0,0">
<StackPanel Background="#6c4a7d" Width="auto" Margin="0,248,0,95">
<StackPanel Orientation="Horizontal">
<Button x:Name="btnCancel" Content="Cancel" Click="btnCancel_Click"/>
<TextBlock Text="BookmarkList" VerticalAlignment="Center" Margin="100 0 0 0"></TextBlock>
<Button Margin="70,0,0,0" Background="Transparent" HorizontalAlignment="Left" BorderBrush="Transparent" Width="80" Height="70" Name="DeleteAll" Click="DeleteAll_Click" Canvas.ZIndex="10" >
<StackPanel Width="68" Height="60" Margin="0,-5,-40,-14" UseLayoutRounding="False" RenderTransformOrigin="0.45,0.5" >
<StackPanel.Projection>
<PlaneProjection RotationX="24" RotationY="9"/>
</StackPanel.Projection>
<StackPanel.RenderTransform>
<CompositeTransform TranslateX="-1" TranslateY="-12"/>
</StackPanel.RenderTransform>
<TextBlock Visibility="Collapsed" Text="{Binding Bookname}"></TextBlock>
<TextBlock Visibility="Collapsed" Text="{Binding Pageno}"></TextBlock>
<Image Source="/Assets/delete_bookmark.png" Width="74" Height="65"
HorizontalAlignment="Center" VerticalAlignment="Center" Margin="8,-4,11,570" Canvas.ZIndex="62" RenderTransformOrigin="0.55,0.5">
<Image.Projection>
<PlaneProjection CenterOfRotationX="0.1" LocalOffsetX="-1"/>
</Image.Projection>
<Image.RenderTransform>
<CompositeTransform TranslateX="1" ScaleX="0.95"/>
</Image.RenderTransform>
</Image>
</StackPanel>
</Button>
<!--<Button x:Name="btnOK" Content="OK"/>-->
</StackPanel>
<ListBox Name="Bookmark_List" SelectionChanged="Bookmark_List_SelectionChanged" >
<ListBox.ItemTemplate >
<DataTemplate>
<Grid Margin="10 10 10 10">
<StackPanel Orientation="Horizontal">
<TextBlock Text="{Binding Bookname}" Foreground="White" VerticalAlignment="Center"></TextBlock>
<TextBlock Text="{Binding Pageno}" FontSize="29" VerticalAlignment="Center" Margin="30 0 0 0" Foreground="White"></TextBlock>
<!--<Button Margin="5 0 0 0" Background="Transparent" HorizontalAlignment="Right" BorderBrush="Transparent" Width="80" Height="70" Name="DeleteBookmark" Click="DeleteBookmark_Click" >
<StackPanel>
<TextBlock Visibility="Collapsed" Text="{Binding Bookname}"></TextBlock>
<TextBlock Visibility="Collapsed" Text="{Binding Pageno}"></TextBlock>
<Image Source="/Assets/delete_bookmark.png" Width="62" Height="100"
HorizontalAlignment="Center" VerticalAlignment="Center"/>
</StackPanel>
</Button>-->
<Button Margin="5 0 0 0" Background="Transparent" HorizontalAlignment="Right" BorderBrush="Transparent" Width="80" Height="70" Click="DeleteBookmark_Click" Name="DeleteBookmark" >
<StackPanel >
<TextBlock Visibility="Collapsed" Text="{Binding Bookname}"></TextBlock>
<TextBlock Visibility="Collapsed" Text="{Binding Pageno}"></TextBlock>
<Image Source="/Assets/delete_book.png" Width="45" Height="30"
HorizontalAlignment="Center" VerticalAlignment="Center"/>
</StackPanel>
</Button>
</StackPanel>
</Grid>
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</StackPanel>
</Grid>
</Grid>
</phone:PhoneApplicationPage>
Please apply a height to listbox and set ScrollViewer.VerticalScrollBarVisibility
<ListBox Name="Bookmark_List" Height="450" ScrollViewer.VerticalScrollBarVisibility="Visible" SelectionChanged="Bookmark_List_SelectionChanged" >
I have the following problem:
<DataTemplate x:Key="OrganisationsItemTemplate">
<StackPanel VerticalAlignment="Top" Margin="5,0,0,0">
<Button Command="{Binding Path=DataContext.LoadSpacesCommand, ElementName=OrganisationList}" CommandParameter="{Binding}" Padding="-5,0,-5,-5" Margin="-7,-12,-7,-7" Height="auto" BorderThickness="0" HorizontalAlignment="Left" VerticalAlignment="Stretch" HorizontalContentAlignment="Left" UseLayoutRounding="True" FontSize="0.01">
<Grid Margin="0,0,5,0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="67"/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<StackPanel Grid.Column="0" Background="Transparent">
<Border Background="White" BorderThickness="0" Width="62" Height="62" HorizontalAlignment="Left" Margin="0,0,0,5">
<Image Source="{Binding image.thumbnail_link}" Width="62" Height="62"></Image>
</Border>
</StackPanel>
<StackPanel Grid.Column="1" VerticalAlignment="Center" Background="Transparent">
<!--<TextBlock Text="{Binding name}" HorizontalAlignment="Left" FontSize="30" VerticalAlignment="Center" Margin="0,0,0,5" />-->
<phone:LongListSelector x:Name="SpacesList"
Background="Transparent"
ItemTemplate="{StaticResource SpacesTemplate }"
ItemsSource="{Binding spaces}"
Margin="40,0,0,96"
LayoutMode="List"
HideEmptyGroups="True"
IsGroupingEnabled="False" VerticalContentAlignment="Top">
</phone:LongListSelector>
</StackPanel>
</Grid>
</Button>
</StackPanel>
</DataTemplate>
<DataTemplate x:Key="SpacesTemplate">
<Border Background="Transparent" Padding="5,0,0,5">
<Border Background="{StaticResource PhoneAccentBrush}" BorderBrush="{StaticResource PhoneAccentBrush}" BorderThickness="2" Width="62"
Height="62" Margin="0,0,18,0" HorizontalAlignment="Left">
<TextBlock Text="{Binding name}" Foreground="{StaticResource PhoneForegroundBrush}" FontSize="48" Padding="6"
FontFamily="{StaticResource PhoneFontFamilySemiLight}" HorizontalAlignment="Left" VerticalAlignment="Center"/>
</Border>
</Border>
</DataTemplate>
In my data template I am placing LongListselector... which also needs a template. but the SpacesTemplate that is defined outside the current datatemplate cannot be seen. any ideas how to reference the datatemplate "SpacesTemplate" from within the datatemplate "OrganisationsItemTemplate"
Xaml is read top down, if you want to use SpacesTemplate inside OrganisationsItemTemplate you will have to put SpacesTemplate before OrganisationsItemTemplate in the Xaml