Селектор длинного списка автоматически прокручивается вниз при расширении ввода

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

Но когда пользователь доходит до конца селектора длинного списка и начинает писать в последнем текстовом поле, текстовое поле расширяется за пределы селектора длинного списка. Это означает, что пользователь должен прекратить писать и прокрутить селектор длинного списка вниз, а затем продолжить запись.

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

Это мой код xaml для селектора длинного списка

<Grid x:Name="ContentPanel" Margin="12,49,12,0" Grid.RowSpan="2">

        <Grid.RowDefinitions>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>
        <phone:LongListSelector x:Name="ChatList"  Grid.Row="0" HorizontalAlignment="Left" Width="456" Padding="0" >
            <phone:LongListSelector.ItemTemplate>
                <DataTemplate>
                    <local:ChatRoomTemplateSelector Content="{Binding}">
                        <local:ChatRoomTemplateSelector.YourSelf>
                            <DataTemplate x:Name="YourSelf">
                                <StackPanel>
                                    <Grid x:Name="YourSelfGrid">
                                        <Grid.RowDefinitions>
                                            <RowDefinition Height="*"/>
                                        </Grid.RowDefinitions>
                                        <UserControl Grid.Row="0">
                                            <Path Data="Data" Fill="LawnGreen" StrokeThickness="0" Stretch="Fill" UseLayoutRounding="True"/>
                                        </UserControl>
                                        <TextBox Background="LawnGreen" Text="{Binding Path=Post, Mode=TwoWay,UpdateSourceTrigger=Explicit}" IsReadOnly="{Binding readOnly}" FontSize="20" Margin="39,10" TextWrapping="Wrap" BorderBrush="LawnGreen" Style="{StaticResource TextBoxStyleYourself}" TextChanged="OnTextBoxTextChanged"/>

                                    </Grid>
                                    <StackPanel Orientation="Horizontal">

                                        <Path Data="Data" Fill="LawnGreen" StrokeThickness="0" Stretch="Fill" UseLayoutRounding="True" Margin="50,-1,0,0"/>

                                        <TextBlock Text="{Binding Name}" FontWeight="Bold" FontSize="25" TextWrapping="Wrap"/>
                                    </StackPanel>
                                </StackPanel>
                            </DataTemplate>
                        </local:ChatRoomTemplateSelector.YourSelf>
                        </local:ChatRoomTemplateSelector>
                </DataTemplate>
            </phone:LongListSelector.ItemTemplate>
        </phone:LongListSelector>

    </Grid>
</Grid>

И я добавляю контент в селектор длинного списка с помощью этого фрагмента кода

source.Add(new Data() { Name = ChatRoomOverview.userName, User = "YourSelf", readOnly = false, Post = "" });
ChatList.ItemsSource = source;

Изменить

Я знаю, как прокрутить до последнего элемента при запуске, и LLS работает нормально. Но когда пользователь в последнем вставленном элементе вводит много текста, так что текстовое поле расширяется за пределы представления, я не могу заставить LLS сохранять элемент в поле зрения. Как мне это сделать?


c# xaml autoscroll windows-phone-8 longlistselector
person JTIM    schedule 05.11.2013    source источник

Ответы (1)


arrow_upward
0
arrow_downward

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

Обновление:

В качестве решения расширяющегося текстового поля в нижней части проблемы LLS. Вместо этого вы можете сделать следующее:

XAML:

<Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">
    <ScrollViewer x:Name="MyScrollViewer">
        <StackPanel>
        <ItemsControl x:Name="MyItems">
            <ItemsControl.ItemTemplate>
                <DataTemplate>
                    <TextBlock Style="{StaticResource PhoneTextExtraLargeStyle}"
                                TextWrapping="Wrap"
                                Text="{Binding}" />
                </DataTemplate>
            </ItemsControl.ItemTemplate>
        </ItemsControl>
        <TextBox AcceptsReturn="True"
                    FontSize="36"
                    TextWrapping="Wrap"
                    VerticalScrollBarVisibility="Auto"
                    Text="{Binding}"
                    TextChanged="OnTextChanged"
                    Margin="0,0,0,48" />
        </StackPanel>
    </ScrollViewer>
</Grid>

Код позади:

public partial class MainPage : PhoneApplicationPage
{
    public MainPage()
    {
        this.InitializeComponent();

        // Some sample existing items
        this.MyItems.ItemsSource = new[] { "one", "two", "three", "four", "five" };
    }

    private void OnTextChanged(object sender, TextChangedEventArgs e)
    {
        // This is a brute force attempt to scroll to the bottom of all content.
        // You may want to be smarter about when this is done, such as when a "\r"
        // is added to the end of the text in the textbox or the text is added
        // such that it forces a new line. Beware text being changed in the middle
        // of a large block of text as may not want that to trigger a scroll to the bottom.
        this.MyScrollViewer.ScrollToVerticalOffset(double.MaxValue);
    }
}

Все немного сыровато, но, надеюсь, вы поняли идею.

При этом используются отдельные ItemsControl и TextBox внутри ScrollViewer, чтобы имитировать поведение LLS, и всегда будет расширяться, оставляя видимой нижнюю часть TextBox, при этом позволяя прокручивать весь контент.
Очевидно, что это не сработает, если вы сильно привязаны к хотя ЛЛС.

person Matt Lacey    schedule 05.11.2013
comment
Извините, возможно, вопрос немного некорректен. Но вопрос, который вы решаете, я решил. Поэтому, когда я заполняю элементы, я использую scrollTo, чтобы перейти к нижней части и начать там. С другой стороны, моя проблема заключается в том, что последний элемент представляет собой расширяющееся текстовое поле. Так немного похоже на текстовое поле смс. Это означает, что когда пользователь что-то вводит и достигает максимального размера, текстовое поле расширяется. Проблема возникает, когда текстовое поле выходит за пределы размера LLS. Затем пользователь должен остановиться и прокрутить вниз, а затем продолжить. Проблема для меня в том, как заставить LLS прокручиваться вниз, чтобы текст оставался в поле зрения? - person JTIM; 06.11.2013
comment
@JTIM обновил ответ с возможным решением проблемы с расширяющимся текстовым полем. - person Matt Lacey; 13.11.2013
comment
Я пытаюсь использовать ваше предложение. Поскольку, как вы утверждаете, я не связан с LLS. Теперь я изменил весь контент в XAML, и он работает нормально, в том смысле, что мой контент отображается. Одно редактирование мне пришлось удалить текстовое поле вне элемента управления. Затем я захотел реализовать прокрутку. Итак, я начал с этого.MyScrollViewer.ScrollToVerticalOffset(double.MaxValue); но это не работает. Любые предложения для этого? Кажется, что у него нет никакой информации, когда я смотрю в отладчике, насколько велик на самом деле прокрутка? - person JTIM; 15.11.2013