WP7 - LongListSelector, how to hide vertical scroll bar

Question

I need to hide vertical scrollbar in LongListSelector. For this I use:

ScrollViewer.VerticalScrollBarVisibility="Hidden"

In ListBox it works well but in LongListSelector it doesn't work.

This is my LongListSelector code:

<Grid x:Name="ContentPanel"
      Grid.Row="1"
      Margin="12,0,12,0">
  <toolkit:LongListSelector x:Name="TasksLongListSelector"
                            Margin="0,12,0,0"
                            Background="Transparent"
                            ScrollViewer.VerticalScrollBarVisibility="Hidden">
    <toolkit:LongListSelector.GroupHeaderTemplate>
      <DataTemplate>
        <Border Width="431"
                Height="53"
                HorizontalAlignment="Left"
                BorderThickness="2"
                BorderBrush="White"
                Margin="13,0,0,22">
          <Grid HorizontalAlignment="Stretch"
                VerticalAlignment="Stretch">
            <Grid.ColumnDefinitions>
              <ColumnDefinition Width="*" />
              <ColumnDefinition Width="Auto" />
            </Grid.ColumnDefinitions>
            <TextBlock Text="{Binding Key, Converter={StaticResource LocalDateConverter}}"
                       FontSize="20"
                       FontWeight="Bold"
                       Foreground="White"
                       HorizontalAlignment="Left"
                       Padding="14,10,0,0" />
            <Image Grid.Column="1"
                   Source="/Images/CalendarWhiteIcon.png"
                   Width="21"
                   Height="21"
                   HorizontalAlignment="Right"
                   VerticalAlignment="Top"
                   Margin="0,13,14,0" />
          </Grid>
        </Border>
      </DataTemplate>
    </toolkit:LongListSelector.GroupHeaderTemplate>
    <toolkit:LongListSelector.ItemTemplate>
      <DataTemplate>
        <Button Background="White"
                Width="455"
                Height="105"
                Margin="0,-12,0,12"
                Tag="{Binding Id}"
                HorizontalContentAlignment="Stretch"
                VerticalContentAlignment="Stretch"
                Click="Button_Click_1">
          <Grid HorizontalAlignment="Stretch"
                VerticalAlignment="Stretch">
            <Grid.ColumnDefinitions>
              <ColumnDefinition Width="Auto" />
              <ColumnDefinition Width="Auto" />
              <ColumnDefinition Width="Auto" />
              <ColumnDefinition Width="*" />
            </Grid.ColumnDefinitions>
            <Grid.RowDefinitions>
              <RowDefinition Height="*" />
              <RowDefinition Height="24" />
            </Grid.RowDefinitions>
            <TextBlock Grid.ColumnSpan="4"
                       Text="{Binding Name}"
                       FontSize="24"
                       Foreground="#400000" />
            <Image Grid.Row="1"
                   Visibility="{Binding Project, Converter={StaticResource StringToVisibilityConverter}}"
                   Source="/Images/ProjectIcon.png"
                   Width="20"
                   Height="18"
                   HorizontalAlignment="Left"
                   VerticalAlignment="Top"
                   Margin="0,0,5,0" />
            <TextBlock Grid.Row="1"
                       Grid.Column="1"
                       Visibility="{Binding Project, Converter={StaticResource StringToVisibilityConverter}}"
                       Text="{Binding Project, Converter={StaticResource ToUppercaseConverter}}"
                       FontSize="16"
                       Foreground="#666666"
                       HorizontalAlignment="Left"
                       VerticalAlignment="Top"
                       Margin="0,-2,9,0"
                       LineStackingStrategy="BlockLineHeight" />
            <Image Grid.Row="1"
                   Grid.Column="2"
                   Visibility="{Binding Context, Converter={StaticResource StringToVisibilityConverter}}"
                   Source="/Images/ContextIcon.png"
                   Width="20"
                   Height="18"
                   HorizontalAlignment="Left"
                   VerticalAlignment="Top"
                   Margin="-3,1,1,0" />
            <TextBlock Grid.Row="1"
                       Grid.Column="3"
                       Visibility="{Binding Context, Converter={StaticResource StringToVisibilityConverter}}"
                       Text="{Binding Context, Converter={StaticResource ToUppercaseConverter}}"
                       FontSize="16"
                       Foreground="#666666"
                       HorizontalAlignment="Left"
                       VerticalAlignment="Top"
                       Margin="0,-2,0,0"
                       LineStackingStrategy="BlockLineHeight" />
          </Grid>
        </Button>
      </DataTemplate>
    </toolkit:LongListSelector.ItemTemplate>
  </toolkit:LongListSelector>
</Grid>

How can I hide vertical scrollbar in LongListSelector?

Earlgray Earlgray · Accepted Answer · 2013-04-23T22:47:45

I found solution. To LongListSelector event Loaded add this code:

ScrollViewer sv = VisualTreeHelper.GetChild(VisualTreeHelper.GetChild(TasksLongListSelector, 0), 0) as ScrollViewer;
ScrollBar sb = ((FrameworkElement)VisualTreeHelper.GetChild(sv, 0)).FindName("VerticalScrollBar") as ScrollBar;
sb.Width = 0;

WP7 - LongListSelector, how to hide vertical scroll bar

1 Answers