Не удается прокрутить список в WP7

Question

У меня есть элемент управления списком, где элементы добавляются с помощью пользовательского элемента управления, имеющего текстовый блок и изображение.

<UserControl
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"
FontFamily="{StaticResource PhoneFontFamilyNormal}"
FontSize="{StaticResource PhoneFontSizeNormal}"
Foreground="{StaticResource PhoneForegroundBrush}"
d:DesignHeight="52" d:DesignWidth="480">

<Grid x:Name="LayoutRoot" Background="{StaticResource PhoneChromeBrush}">
    <TextBlock Height="30" HorizontalAlignment="Left" Margin="12,10,0,0" Name="Index_itemtext" Text="" VerticalAlignment="Top" Width="145" />
    <Image Height="34"  HorizontalAlignment="Right" Margin="0,6,55,0" Source="blue_triangle.png" Name="IndexList_itemImage" Stretch="Uniform" VerticalAlignment="Top" Width="66" />
    <Line Height="10" HorizontalAlignment="Left" Margin="0,38,0,0" Name="seperator_line" Stroke="White" StrokeThickness="2" VerticalAlignment="Top" Width="480" Stretch="Fill" Fill="#FFF5E9E9" />
</Grid>

И поле списка xaml:

  <Grid x:Name="LayoutRoot" Background="Transparent">
    <Grid.RowDefinitions>
        <RowDefinition Height="768"/>
        <RowDefinition Height="0*" />
    </Grid.RowDefinitions>

    <Grid  Opacity="5"  VerticalAlignment="Top" Grid.Row="0">
        <Grid.Background>
            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                <GradientStop Color="#FF282828" Offset="0.366" />
                <GradientStop Color="#FE848484" Offset="1" />
            </LinearGradientBrush>
        </Grid.Background>

        <Button  Content="Top" Grid.Column="0" HorizontalAlignment="Left" Grid.Row="0" VerticalAlignment="Top" Height="72"  Name="Top_btn"  Width="114"  BorderBrush="{x:Null}" Click="topbutton_Click" Style="{StaticResource ButtonStyle1}" >             
            <Button.Background>
                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                    <GradientStop Color="#FF908585" Offset="0.11" />
                    <GradientStop Color="#FF342E2E" Offset="1" />
                </LinearGradientBrush>
            </Button.Background>
        </Button>

        <Button Content="Back" Height="72" Grid.Column="1"  Grid.Row="0" Name="Back_btn" Width="104" HorizontalAlignment="Right" HorizontalContentAlignment="Center" Margin="0"  BorderBrush="{x:Null}" Click="backbutton_Click" Style="{StaticResource ButtonStyle1}" >
            <Button.Background>
                <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                    <GradientStop Color="#FF908585" Offset="0.11" />
                    <GradientStop Color="#FF342E2E" Offset="1" />
                </LinearGradientBrush>
            </Button.Background>
        </Button>
    </Grid>

            <ListBox Name="Index_list" ScrollViewer.VerticalScrollBarVisibility="Visible"  VerticalContentAlignment="Top" SelectionChanged="on_selection" Margin="0,78,0,0" Height="Auto">
        <ListBoxItem Style="{StaticResource ListBoxItemStyle}">


        </ListBoxItem>
    </ListBox>



</Grid>

Теперь, когда я добавляю элементы в список, вертикальная прокрутка не перемещается до тех пор, пока последний элемент / нижняя часть списка недоступны, т. Е. Возвращается к первой строке, которая останавливается после выбора последнего элемента:

 for (int i = 0; i < gridSize; i++)
            {
                listbox_item list_item = new listbox_item();
                list_item.Index_itemtext.FontSize = 25;
                list_item.Index_itemtext.Text = index[i];
                list_item.IndexList_itemImage.Source = new BitmapImage(new Uri("some.png", UriKind.Relative));
                list_item.seperator_line.StrokeThickness = 5;
                list_item.Margin = new Thickness(0, 0, 0, 5);
                Index_list.Items.Add(list_item);
            }

Кроме того, строка списка не занимает ширину устройства в альбомном режиме, тогда как требуется, чтобы элемент строки расширялся при изменении ширины устройства. Может ли кто-нибудь помочь с этими проблемами?

Answer 1

Поместив код, который вы показали до сих пор, в пример проекта, у меня нет проблем, которые вы описываете при прокрутке, поэтому я предполагаю, что есть другие элементы на странице наряду с ListBox, которые влияет на макет и, следовательно, прокрутку.

Как упомянуто выше, проблема с изменением ориентации была связана с элементами фиксированной ширины, которые можно решить с помощью столбцов со звездообразной шириной, как обсуждено в Поддержка автоматического поворота или Поддержка автоматической ориентации нескольких ориентаций для Windows Phone на блоге разработчиков Windows Phone.

Еще один момент, на который стоит обратить внимание: если у вас нет логики, связанной с этими элементами, для которых вы создали listbox_item UserControl, вы можете реализовать макет, указав свойство ItemTemplate ListBox и затем вы можете просто создать список объектов данных и связать их со свойством ItemsSource. Э.Г.

<ListBox x:Name="Index_list"
         HorizontalContentAlignment="Stretch"
         Margin="0,78,0,0"
         SelectionChanged="on_selection"
         VerticalContentAlignment="Top">
  <ListBox.ItemTemplate>
    <DataTemplate>
        <Grid Background="{StaticResource PhoneChromeBrush}">
            <!-- Column definitions here. -->
            <TextBlock Height="30" HorizontalAlignment="Left" Text="{Binding Label}" VerticalAlignment="Top" />
            <Image Height="34" HorizontalAlignment="Right" Margin="0,6,55,0" Source="{Binding ImagePath}" Stretch="Uniform" VerticalAlignment="Top" Width="66" />
            <Line Height="10" HorizontalAlignment="Stretch" Margin="0,38,0,0" Stroke="White" StrokeThickness="2" VerticalAlignment="Top" Stretch="Fill" Fill="#FFF5E9E9" />
        </Grid>
    </DataTemplate>
  </ListBox.ItemTemplate>
</ListBox>

Answer 2

Метод ListBox.ScrollIntoView позволяет прокручивать ListBox для просмотра определенного элемента. Кроме того, с помощью ListBox WP7, если вы выбираете элемент, он автоматически прокручивается в поле зрения.

Что касается вашего вопроса о строках, вам нужно установить ListBoxItemsStyle следующим образом:

    <Style x:Key="ListBoxItemStyle" TargetType="ListBoxItem">
        <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
        <Setter Property="HorizontalAlignment" Value="Stretch"/>
    </Style>

И удалите жестко запрограммированные значения ширины в шаблоне.

Answer 3

По проблеме ландшафта - вы устанавливаете свойство Width для всех ваших элементов UserControl, чтобы они не масштабировались автоматически.

По вопросу прокрутки вы можете перефразировать вопрос - извините, но я неуверен, что я понимаю проблему - «вертикальная прокрутка не идет до последнего элемента, то есть возвращается к первому ряду, который останавливается после выбора последнего элемента» для меня не имеет смысла - извините