Windows Mobile 7.1 - Screen layout question

Been developing a Windows Mobile 7.1 application.  I have a screen which has a number of text boxes within a vertical stack panel and then I want to display a list of items beneath that so I have used a ListBox.  

My problem is that it looks a bit odd as I really want the whole page to scroll and not just the list of items as the list starts very close to the bottom of the display.  How can I achieve this?
ChrisMDrewAsked:
Who is Participating?
 
Mikal613Connect With a Mentor Commented:
<!--TitlePanel -->
            <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="0,0,0,5">
                  <Image Source="Images/viewpatch.jpg" Width="480" Height="100"  />
            </StackPanel>

            <ScrollViewer Grid.Row="1" Margin="0,0,0,0" Height="500">
-- Your content


You want to make the height of the scroll viewer in the realms of the page so the "500" will allow 500 px of space to scroll all the content in the scroll viewer.
0
 
Mikal613Commented:
If I understand what your saying, you can use a scroll viewer. It allows you to scroll a long object in a defined size.
0
Free Tool: Path Explorer

An intuitive utility to help find the CSS path to UI elements on a webpage. These paths are used frequently in a variety of front-end development and QA automation tasks.

One of a set of tools we're offering as a way of saying thank you for being a part of the community.

 
ChrisMDrewAuthor Commented:
That's what I thought as well after a biit of research.  I have attached my XAML file though and I just can't see what is wrong.  I guess it could be the Telerik controls causing issues however what happens is that I cannot scroll the screen up to see the last of the Radloopinglist controls or the text boxes which follow...
<phone:PhoneApplicationPage 
    x:Class="Blu3.ViewPatchPage"
	xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:sys="clr-namespace:System;assembly=mscorlib"
	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"
    xmlns:telerikInput="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Input"
	xmlns:telerikPrimitives="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Primitives"
    xmlns:telerikPrimitivesLoopingList="clr-namespace:Telerik.Windows.Controls.LoopingList;assembly=Telerik.Windows.Controls.Primitives" DataContext="{Binding}"
    mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="768"
    FontFamily="{StaticResource PhoneFontFamilyNormal}"
    FontSize="{StaticResource PhoneFontSizeNormal}"
    Foreground="{StaticResource PhoneForegroundBrush}"
    SupportedOrientations="Portrait" Orientation="Portrait"
    shell:SystemTray.IsVisible="True">


	<!--LayoutRoot is the root grid where all page content is placed-->
    <Grid x:Name="LayoutRoot" Background="Transparent">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

		<!--TitlePanel -->
		<StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="0,0,0,5">
			<Image Source="Images/viewpatch.jpg" Width="480" Height="100"  />
		</StackPanel>

		<ScrollViewer Grid.Row="1" Margin="0,0,0,0">

			<StackPanel Margin="0,0,0,0">
			
				<ListBox Name="lbPatchData" Margin="0,0,0,0">

					<StackPanel Margin="0,0,0,0" Width="480">
						<TextBlock Text="Patch ID: 12345" Name="lblPatchID" FontWeight="Bold" FontSize="24" VerticalAlignment="Center" HorizontalAlignment="Center"></TextBlock>

						<TextBlock Text="Task Type:" VerticalAlignment="Center"></TextBlock>
						<TextBox Name="tbTaskType" TextWrapping="Wrap" IsEnabled="False" Text="{Binding TaskType}"></TextBox>

						<TextBlock Text="Road Class:" VerticalAlignment="Center"></TextBlock>
						<TextBox Name="tbRoadClass" IsEnabled="False" Text="{Binding RoadClass}"></TextBox>

						<StackPanel Margin="0,0,0,0" Width="480">
							<TextBlock Text="Surface:" VerticalAlignment="Center"></TextBlock>
					
							<telerikInput:RadListPicker Name="rlpSurface" SelectionChanged="rlpSurface_SelectionChanged">
								<sys:String>Surface 1</sys:String>
								<sys:String>Surface 2</sys:String>
								<sys:String>Surface 3</sys:String>
								<sys:String>Surface 4</sys:String>
							</telerikInput:RadListPicker>
						
							<TextBlock Text="Status:" VerticalAlignment="Center"></TextBlock>
							<telerikInput:RadListPicker Name="rlpStatus" SelectionChanged="rlpStatus_SelectionChanged">
								<sys:String>Not Visited</sys:String>
								<sys:String>Visited (Complete)</sys:String>
								<sys:String>Visited (Not Complete)</sys:String>
								<sys:String>Abandoned</sys:String>
							</telerikInput:RadListPicker>

							<TextBlock Text="Depth:" VerticalAlignment="Center"></TextBlock>
							<StackPanel Orientation="Horizontal" Margin="10,10,0,0" Height="90">
								<telerikPrimitives:RadLoopingList ItemWidth="75" ItemHeight="75" x:Name="depthList1" IsCentered="True" IsExpanded="False" Height="90" Width="90" FontSize="32" HorizontalAlignment="Center" />
								<telerikPrimitives:RadLoopingList ItemWidth="75" ItemHeight="75" x:Name="depthList2" IsCentered="True" IsExpanded="False" Height="90" Width="90" FontSize="32" HorizontalAlignment="Center" />
								<TextBlock Text="." FontSize="40" VerticalAlignment="Center" Height="75" Padding="20, 0, 0, 0" Width="50" />
								<telerikPrimitives:RadLoopingList ItemWidth="75" ItemHeight="75" x:Name="depthList3" IsCentered="True" IsExpanded="False" Height="90" Width="90" FontSize="32" HorizontalAlignment="Center" />
								<telerikPrimitives:RadLoopingList ItemWidth="75" ItemHeight="75" x:Name="depthList4" IsCentered="True" IsExpanded="False" Height="90" Width="90" FontSize="32" HorizontalAlignment="Center" />
							</StackPanel>
					
							<TextBlock Text="Width:" VerticalAlignment="Center"></TextBlock>
							<StackPanel Orientation="Horizontal" Margin="10,10,0,0" Height="90">
								<telerikPrimitives:RadLoopingList ItemWidth="75" ItemHeight="75" x:Name="widthList1" IsCentered="True" IsExpanded="False" Height="90" Width="90" FontSize="32" />
								<telerikPrimitives:RadLoopingList ItemWidth="75" ItemHeight="75" x:Name="widthList2" IsCentered="True" IsExpanded="False" Height="90" Width="90" FontSize="32" />
								<TextBlock Text="." FontSize="40" VerticalAlignment="Center" Height="75" Padding="20, 0, 0, 0" Width="50"/>
								<telerikPrimitives:RadLoopingList ItemWidth="75" ItemHeight="75" x:Name="widthList3" IsCentered="True" IsExpanded="False" Height="90" Width="90" FontSize="32" />
								<telerikPrimitives:RadLoopingList ItemWidth="75" ItemHeight="75" x:Name="widthList4" IsCentered="True" IsExpanded="False" Height="90" Width="90" FontSize="32"/>
							</StackPanel>

							<TextBlock Text="Length:" VerticalAlignment="Center"></TextBlock>
							<StackPanel Orientation="Horizontal" Margin="10,10,0,0" Height="90">
								<telerikPrimitives:RadLoopingList ItemWidth="75" ItemHeight="75" x:Name="lengthList1" IsCentered="True" IsExpanded="False" Height="90" Width="90" FontSize="32" />
								<telerikPrimitives:RadLoopingList ItemWidth="75" ItemHeight="75" x:Name="lengthList2" IsCentered="True" IsExpanded="False" Height="90" Width="90" FontSize="32" />
								<TextBlock Text="." FontSize="40" VerticalAlignment="Center" Height="75" Padding="20, 0, 0, 0" Width="50" />
								<telerikPrimitives:RadLoopingList ItemWidth="75" ItemHeight="75" x:Name="lengthList3" IsCentered="True" IsExpanded="False" Height="90" Width="90" FontSize="32" />
								<telerikPrimitives:RadLoopingList ItemWidth="75" ItemHeight="75" x:Name="lengthList4" IsCentered="True" IsExpanded="False" Height="90" Width="90" FontSize="32"/>
							</StackPanel>
						</StackPanel>

						<TextBlock Text="Notes:" VerticalAlignment="Center"></TextBlock>
						<TextBox Name="tbNotes" Text="{Binding Path=Notes, Mode=TwoWay}" Height="120" TextChanged="tbNotes_TextChanged"></TextBox>

					</StackPanel>

				</ListBox>
			
			</StackPanel>
		</ScrollViewer>

	</Grid>

</phone:PhoneApplicationPage>

Open in new window

0
 
Mikal613Commented:
try setting a height to the scrollviewer.
0
 
ChrisMDrewAuthor Commented:
tried simplifying it a bit but still no luck getting it to scroll.  Any thoughts?
<TextBlock Text="Notes:" VerticalAlignment="Center"></TextBlock>
				<TextBox Name="tbNotes" Text="{Binding Path=Notes, Mode=TwoWay}" Height="120" TextChanged="tbNotes_TextChanged"></TextBox>

Open in new window

0
 
ChrisMDrewAuthor Commented:
I'm also getting a strange effect sometimes when I click on one of fields on the page all of the text gets displayed in red - I suspect that this is a selection effect but its neither consistent or desired...
0
 
Mikal613Commented:
Yes there is a selected event that needs to be handled on the listbox items.

I dont think all your code was posted on the above comment...
0
 
ChrisMDrewAuthor Commented:
Thanks - no for some reason it didn't all paste - here's the XAML again...
<Grid x:Name="LayoutRoot" Background="Transparent">
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto"/>
            <RowDefinition Height="1200"/>
        </Grid.RowDefinitions>

		<!--TitlePanel -->
		<StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="0,0,0,5">
			<Image Source="Images/viewpatch.jpg" Width="480" Height="100"  />
		</StackPanel>

		<ScrollViewer Grid.Row="1" Margin="0,0,0,0" Height="1200">

			<StackPanel Margin="0,0,0,0" Width="480">
				<TextBlock Text="Patch ID: 12345" Name="lblPatchID" FontWeight="Bold" FontSize="24" VerticalAlignment="Center" HorizontalAlignment="Center"></TextBlock>

				<TextBlock Text="Task Type:" VerticalAlignment="Center"></TextBlock>
				<TextBox Name="tbTaskType" TextWrapping="Wrap" IsEnabled="False"></TextBox>

				<TextBlock Text="Road Class:" VerticalAlignment="Center"></TextBlock>
				<TextBox Name="tbRoadClass" IsEnabled="False"></TextBox>

				<TextBlock Text="Surface:" VerticalAlignment="Center"></TextBlock>
					
				<telerikInput:RadListPicker Name="rlpSurface" SelectionChanged="rlpSurface_SelectionChanged">
					<sys:String>Surface 1</sys:String>
					<sys:String>Surface 2</sys:String>
					<sys:String>Surface 3</sys:String>
					<sys:String>Surface 4</sys:String>
				</telerikInput:RadListPicker>
						
				<TextBlock Text="Status:" VerticalAlignment="Center"></TextBlock>
				<telerikInput:RadListPicker Name="rlpStatus" SelectionChanged="rlpStatus_SelectionChanged">
					<sys:String>Not Visited</sys:String>
					<sys:String>Visited (Complete)</sys:String>
					<sys:String>Visited (Not Complete)</sys:String>
					<sys:String>Abandoned</sys:String>
				</telerikInput:RadListPicker>

				<TextBlock Text="Depth:" VerticalAlignment="Center"></TextBlock>
				<StackPanel Orientation="Horizontal" Margin="10,10,0,0" Height="90">
					<telerikPrimitives:RadLoopingList ItemWidth="75" ItemHeight="75" x:Name="depthList1" IsCentered="True" IsExpanded="False" Height="90" Width="90" FontSize="32" HorizontalAlignment="Center" />
					<telerikPrimitives:RadLoopingList ItemWidth="75" ItemHeight="75" x:Name="depthList2" IsCentered="True" IsExpanded="False" Height="90" Width="90" FontSize="32" HorizontalAlignment="Center" />
					<TextBlock Text="." FontSize="40" VerticalAlignment="Center" Height="75" Padding="20, 0, 0, 0" Width="50" />
					<telerikPrimitives:RadLoopingList ItemWidth="75" ItemHeight="75" x:Name="depthList3" IsCentered="True" IsExpanded="False" Height="90" Width="90" FontSize="32" HorizontalAlignment="Center" />
					<telerikPrimitives:RadLoopingList ItemWidth="75" ItemHeight="75" x:Name="depthList4" IsCentered="True" IsExpanded="False" Height="90" Width="90" FontSize="32" HorizontalAlignment="Center" />
				</StackPanel>
					
				<TextBlock Text="Width:" VerticalAlignment="Center"></TextBlock>
				<StackPanel Orientation="Horizontal" Margin="10,10,0,0" Height="90">
					<telerikPrimitives:RadLoopingList ItemWidth="75" ItemHeight="75" x:Name="widthList1" IsCentered="True" IsExpanded="False" Height="90" Width="90" FontSize="32" />
					<telerikPrimitives:RadLoopingList ItemWidth="75" ItemHeight="75" x:Name="widthList2" IsCentered="True" IsExpanded="False" Height="90" Width="90" FontSize="32" />
					<TextBlock Text="." FontSize="40" VerticalAlignment="Center" Height="75" Padding="20, 0, 0, 0" Width="50"/>
					<telerikPrimitives:RadLoopingList ItemWidth="75" ItemHeight="75" x:Name="widthList3" IsCentered="True" IsExpanded="False" Height="90" Width="90" FontSize="32" />
					<telerikPrimitives:RadLoopingList ItemWidth="75" ItemHeight="75" x:Name="widthList4" IsCentered="True" IsExpanded="False" Height="90" Width="90" FontSize="32"/>
				</StackPanel>

				<TextBlock Text="Length:" VerticalAlignment="Center"></TextBlock>
				<StackPanel Orientation="Horizontal" Margin="10,10,0,0" Height="90">
					<telerikPrimitives:RadLoopingList ItemWidth="75" ItemHeight="75" x:Name="lengthList1" IsCentered="True" IsExpanded="False" Height="90" Width="90" FontSize="32" />
					<telerikPrimitives:RadLoopingList ItemWidth="75" ItemHeight="75" x:Name="lengthList2" IsCentered="True" IsExpanded="False" Height="90" Width="90" FontSize="32" />
					<TextBlock Text="." FontSize="40" VerticalAlignment="Center" Height="75" Padding="20, 0, 0, 0" Width="50" />
					<telerikPrimitives:RadLoopingList ItemWidth="75" ItemHeight="75" x:Name="lengthList3" IsCentered="True" IsExpanded="False" Height="90" Width="90" FontSize="32" />
					<telerikPrimitives:RadLoopingList ItemWidth="75" ItemHeight="75" x:Name="lengthList4" IsCentered="True" IsExpanded="False" Height="90" Width="90" FontSize="32"/>
				</StackPanel>

				<TextBlock Text="Notes:" VerticalAlignment="Center"></TextBlock>
				<TextBox Name="tbNotes" Text="{Binding Path=Notes, Mode=TwoWay}" Height="120" TextChanged="tbNotes_TextChanged"></TextBox>

			</StackPanel>

		</ScrollViewer>

	</Grid>

Open in new window

0
 
ChrisMDrewAuthor Commented:
Thanks - that's the one.  I thought by allocating more space I would be sure to include all controls but I see my mistake now!
0
 
ChrisMDrewAuthor Commented:
Think I should get you to write my app for me as you have answered pretty much all of my questions!
0
 
Mikal613Commented:
Wheres the fun in that??

HAHAHAHAHA
0
 
Mikal613Commented:
If you want me to look at any other questions, you can email me at mikal613 {AT} experts-exchange.com
0
 
ChrisMDrewAuthor Commented:
Thanks - I'm just learning this stuff and its very different from my usual area of Visual C# / WinForms
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

All Courses

From novice to tech pro — start learning today.