Search code examples
c#xamlwindows-phone-7longlistselector

How to disable the scrollview in LongListSelector in windows phone 7


I want to disable the scrollview in LongListSelector.

I tried like this:

<toolkit:LongListSelector x:Name="List_Contacts" 
                                      IsFlatList= "False"
                                      DisplayAllGroups="False"
                                      Margin="0,0,0,100" 
                                      Width="480" 
                                      Background="Transparent" 
                                      ItemsSource="{Binding ResultList}"
                                      ItemTemplate="{StaticResource ItemTemplate}" 
                                      GroupHeaderTemplate="{StaticResource GroupItemHeaderTemplate}"
                                              ScrollViewer.VerticalScrollBarVisibility="Disabled"
                                                  ScrollViewer.HorizontalScrollBarVisibility="Disabled"
                                      Tap="List_Contacts_Tap"/>

But here the scrolling not disabled.

I found one solution from stack overflow

<Style x:Key="LongListSelectorWithNoScrollBarStyle" TargetType="toolkit:LongListSelector">
            <Setter Property="Background" Value="Transparent"/>
            <Setter Property="Foreground" Value="{StaticResource PhoneForegroundBrush}"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="phone:LongListSelector">
                        <Grid Background="{TemplateBinding Background}" d:DesignWidth="480" d:DesignHeight="800">
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="ScrollStates">
                                    <VisualStateGroup.Transitions>
                                        <VisualTransition GeneratedDuration="00:00:00.5"/>
                                    </VisualStateGroup.Transitions>
                                    <VisualState x:Name="Scrolling" />
                                    <VisualState x:Name="NotScrolling"/>
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Grid Margin="{TemplateBinding Padding}">
                                <ViewportControl x:Name="ViewportControl" 
                                                 HorizontalContentAlignment="Stretch" 
                                                 VerticalAlignment="Top"/>
                            </Grid>
                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

But here i am getting error

The type 'ViewportControl' was not found. Verify that you are not missing an assembly reference and that all referenced assemblies have been built.

I have include the namespace into the xaml also.

xmlns:ViewportControl="clr-namespace:System.Windows.Controls.Primitives;assembly=System.Windows"

But still now i am getting the 'ViewportControl' was not found error.

Please help me to disable the scroll in LLS.

Requirment

Here All the elements are scroll able.. LLS will have N number of items. If I scroll the LLS to top the above stack panel also should scroll to top.


Solution

  • You can disable scroll by setting the height of LongListSelector(LLS) more than the height of all your Items. You can set a maximum height to your LLS to avoid scrolling.

    Having a LLS inside a ScrollViewer is not a good practice, both the scrolls will fight for their input events and result will not be as expected.

    Also, to be more focused about your issue, You can add your StackPanels to the ListHeader of LLS, so that the StackPanels will also scroll along with your Items when you scroll your LLS.

    A Sample structure to make use of ListHeader of LLS is,

      <phone:LongListSelector>
        <phone:LongListSelector.ListHeader>
            <StackPanel>
                <StackPanel Name="Panel1"></StackPanel>
                <StackPanel Name="Panel2"></StackPanel>
            </StackPanel>
        </phone:LongListSelector.ListHeader>
      </phone:LongListSelector>