nav[aria-label="Primary Navigation"] { padding: 0; & ul { list-style: none; width: 100%; display: flex; flex-direction: row; justify-content: start; align-items: start; gap: 30px; padding: 0; & li { margin: 0; } & ul li { list-style: none; } } }

How can I add a scroll bar to a DockPane in ArcGIS PRO SDK?

Amadeus111

I generated a DockPane but some laptop users complained they are not able to see whole dockpane neither they can roll vertically to see the rest of the dockpane. There is a vertical scroll viewer shows up on catalog dockpane if content does not fit into it. I would like to utilize something like that.

On my dockpane I have list boxes mainly vs catalog pane has only tree view items but still there should be a way to do this

I tried a few things but I couldn't make it show up

 <StackPanel x:Name="MainStackPanel" Background="WhiteSmoke" 
                    ScrollViewer.CanContentScroll="True" ScrollViewer.VerticalScrollBarVisibility="Visible"
                    ScrollViewer.HorizontalScrollBarVisibility="Visible"
                    >

I would appreciate any help - Thanks

Find more posts tagged with

Accepted answers

KirkKuykendall1

Sorry, that sample is not very easy to experience.

Attached is a project that looks like this when I run it:

ProAppModule1.zip

tempStephenRhea_NV5

I think you're looking for the ScrollViewer XAML element.

<ScrollViewer VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto">
  <ScrollViewer.Content>
    <StackPanel x:Name="MainStackPanel" Background="WhiteSmoke">
    .
    .
    .
    </StackPanel>
  </ScrollViewer.Content>
</ScrollViewer>

All comments

KirkKuykendall1

Did you try doing what this sample does?

https://github.com/Esri/arcgis-pro-sdk/blob/35b2abae06b910e22a3e7d3e7ec5151a57bb5d61/Examples/MapExploration/BookmarkDockPane.xaml#L60

Amadeus111

Hi @KirkKuykendall1

I am not sure what that sample does. Do you mind elaborate?

KirkKuykendall1

Sorry, that sample is not very easy to experience.

Attached is a project that looks like this when I run it:

ProAppModule1.zip

tempStephenRhea_NV5

I think you're looking for the ScrollViewer XAML element.

<ScrollViewer VerticalScrollBarVisibility="Auto" HorizontalScrollBarVisibility="Auto">
  <ScrollViewer.Content>
    <StackPanel x:Name="MainStackPanel" Background="WhiteSmoke">
    .
    .
    .
    </StackPanel>
  </ScrollViewer.Content>
</ScrollViewer>

Amadeus111

@KirkKuykendall1 and @tempStephenRhea_NV5

Thank you for your answers. Both ScrollViewer and ListBox functon the same in terms of scrolling but ListBox changed the design a little bit, so I decided to use ScrollViewer. However, neither of them was scrolling if the controls fit inside in it. Furthermore, when DockPane floating scroll bar was not auto adjusting

So, I created an event which adjust the height of ScrollViewer when UserControl's size changed. Now, it works fine and adapts the height when dockpane size changes.

Here is the code not proper MVVM but it works

private void KSDEUserControl_SizeChanged(object sender, SizeChangedEventArgs e)
        {
            StackPScrollViewer.Height = KSDEUserControl.ActualHeight;
        }

Join the Conversation

Signed in members can post, follow updates, and more. New here? Register a free account.

Quick Links

Community Help
Find useful guides, FAQs, and documents to help you navigate and make the most of Esri Community.