Costom ScrollViewer Wpf - C#

Casianm8

C

Casianm8•9/6/24, 8:30 PM

Hey!
U can try using

Casianm8

C

Casianm8•9/6/24, 9:44 PM

@Martina Nordkvist

Martina Nordkvist

M

Martina NordkvistOP•9/9/24, 5:31 PM

Alright but that does not work.

Casianm8

C

Casianm8•9/9/24, 6:39 PM

Can u send me you'r part from .xaml code?

Casianm8

C

Casianm8•9/9/24, 7:11 PM

One moment, i will post code in 5 min

Casianm8

C

Casianm8•9/9/24, 7:15 PM

Done

Casianm8

C

Casianm8•9/9/24, 7:21 PM

First, you need to create a Grid with two columns: one for the containing the
```
ListBox
```
```
ListBox
```
, and one to display the .
The horizontal should be disabled since we don’t need it, and the vertical should be hidden.
You'll set it so that when the is loaded, the 's maximum value is set to match the scrollable height of the .

Casianm8

C

Casianm8•9/9/24, 7:22 PM

Here is my xaml code for u

Casianm8

C

Casianm8•9/9/24, 7:26 PM

Casianm8

C

Casianm8•9/9/24, 7:33 PM

In the backend code (), make sure to have the following:

At the top of , add the event to set the slider’s maximum value based on the scrollable content.

Also, include an event called to sync the slider’s current position with the scrolling position.

Casianm8

C

Casianm8•9/9/24, 7:33 PM

@Martina Nordkvist

Martina Nordkvist

M

Martina NordkvistOP•9/10/24, 10:18 AM

can i call you and show you?

    <Grid>
        <Grid.ColumnDefinitions>
            <!-- Here will be ListBox with ScrollViewer-->
            <ColumnDefinition Width="300"/>  // 0
            <!-- Here will be Slider Vertical -->
            <ColumnDefinition Width="20"/> // 1
            <!-- Used just for another Content-->
            <ColumnDefinition Width="*"/>  // 2
        </Grid.ColumnDefinitions>

        <Grid Grid.Column="1">
            <Slider x:Name="VerticalSlider" Minimum="0" Maximum="1" Orientation="Vertical"
                    HorizontalAlignment="Center" Margin="0,20,0,20" ValueChanged="VerticalSlider_ValueChanged"/>
        </Grid>

        <Grid Grid.Column="0">
            <ScrollViewer x:Name="scrollViewer" VerticalScrollBarVisibility="Hidden"
                      HorizontalScrollBarVisibility="Disabled">
                <ListBox x:Name="listBox" ScrollViewer.VerticalScrollBarVisibility="Hidden">
                    <!-- Elementele din ListBox -->
                    <ListBoxItem Content="Item 1" Height="60" />
                    <ListBoxItem Content="Item 2" Height="60" />
                    <ListBoxItem Content="Item 3" Height="60" />
                    <ListBoxItem Content="Item 4" Height="60" />
                    <ListBoxItem Content="Item 5" Height="60" />
                    <ListBoxItem Content="Item 6" Height="60" />
                    <ListBoxItem Content="Item 7" Height="60" />
                    <ListBoxItem Content="Item 8" Height="60" />
                    <ListBoxItem Content="Item 9" Height="60" />
                    <ListBoxItem Content="Item 10" Height="60" />
                </ListBox>
            </ScrollViewer>
        </Grid>
        
    </Grid>
</Window>

    <Grid>
        <Grid.ColumnDefinitions>
            <!-- Here will be ListBox with ScrollViewer-->
            <ColumnDefinition Width="300"/>  // 0
            <!-- Here will be Slider Vertical -->
            <ColumnDefinition Width="20"/> // 1
            <!-- Used just for another Content-->
            <ColumnDefinition Width="*"/>  // 2
        </Grid.ColumnDefinitions>

        <Grid Grid.Column="1">
            <Slider x:Name="VerticalSlider" Minimum="0" Maximum="1" Orientation="Vertical"
                    HorizontalAlignment="Center" Margin="0,20,0,20" ValueChanged="VerticalSlider_ValueChanged"/>
        </Grid>

        <Grid Grid.Column="0">
            <ScrollViewer x:Name="scrollViewer" VerticalScrollBarVisibility="Hidden"
                      HorizontalScrollBarVisibility="Disabled">
                <ListBox x:Name="listBox" ScrollViewer.VerticalScrollBarVisibility="Hidden">
                    <!-- Elementele din ListBox -->
                    <ListBoxItem Content="Item 1" Height="60" />
                    <ListBoxItem Content="Item 2" Height="60" />
                    <ListBoxItem Content="Item 3" Height="60" />
                    <ListBoxItem Content="Item 4" Height="60" />
                    <ListBoxItem Content="Item 5" Height="60" />
                    <ListBoxItem Content="Item 6" Height="60" />
                    <ListBoxItem Content="Item 7" Height="60" />
                    <ListBoxItem Content="Item 8" Height="60" />
                    <ListBoxItem Content="Item 9" Height="60" />
                    <ListBoxItem Content="Item 10" Height="60" />
                </ListBox>
            </ScrollViewer>
        </Grid>
        
    </Grid>
</Window>

        private void MainWindow_Loaded(object sender, RoutedEventArgs e)
        {
            // Setăm valoarea maximă a slider-ului în funcție de conținutul care poate fi derulat
            VerticalSlider.Maximum = scrollViewer.ScrollableHeight;
        }

        private void MainWindow_Loaded(object sender, RoutedEventArgs e)
        {
            // Setăm valoarea maximă a slider-ului în funcție de conținutul care poate fi derulat
            VerticalSlider.Maximum = scrollViewer.ScrollableHeight;
        }