リストボックスに垂直スクロールバーを表示するにはどうすればよいですか?


83

以下の例では、数十のフォント名を含むリストボックスがあります。

リストの最初のフォントだけでなく、任意のフォントを選択できるように、自動的に垂直スクロールバーが表示されると思いましたが、そうではありません。

そこで、「ScrollViewer」を追加すると、右側に「スクロールバー領域」が配置されますが、スクロールできるようにスクロールバー領域にスクロールバーがありません(!)。

スクロールバーが自動ではないのはなぜですか?また、スクロールバーを強制的に表示するにはどうすればよいですか?

<StackPanel Name="stack1">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="2*"></RowDefinition>
            <RowDefinition Height="*"></RowDefinition>
        </Grid.RowDefinitions>
        <ScrollViewer>
            <ListBox Grid.Row="0" Name="lstFonts" Margin="3"  ItemsSource="{x:Static Fonts.SystemFontFamilies}"/>
        </ScrollViewer>
    </Grid>
</StackPanel>

回答:


150

ソリューションの問題は、おそらくリストボックス内に配置したいリストボックスの周りにスクロールバーを配置していることです。

リストボックスにスクロールバーを強制する場合は、ScrollBar.VerticalScrollBarVisibility添付プロパティを使用します。

<ListBox 
    ItemsSource="{Binding}" 
    ScrollViewer.VerticalScrollBarVisibility="Visible">
</ListBox>

この値を[自動]に設定すると、必要に応じてスクロールバーがポップアップ表示されます。


3
私の場合、私もListBox内側を入れていて、のサイズの外側で好きなだけ広く伸びていました。と設定を削除し、トリックを行いました。ご協力ありがとうございました!ScrollViewerListBoxItemsListBoxScrollViewerScrollViewer.VerticalScrollBarVisibility="Visible"ScrollViewer.HorizontalScrollBarVisibility="Disabled"
マンダリン2015年

29

ListBoxすでに含まれていますScrollViewer。デフォルトではScrollBar、スペースよりもコンテンツが多い場合にが表示されます。ただし、一部のコンテナはコンテンツに合わせてサイズが変更されるため(たとえばStackPanel)、「スペースよりもコンテンツが多い」ことはありません。このような場合、ListBoxは常にコンテンツに必要なだけのスペースが与えられます。

スペースよりもコンテンツが多い状態を計算するには、サイズを知る必要があります。要素自体にListBox明示的にサイズを設定するかListBox、ホストパネルからサイズを設定して、サイズが制限されていることを確認してください。

ホストパネルが垂直でStackPanel、必要なVerticalScrollBar場合は、ListBoxそれ自体に高さを設定する必要があります。他のタイプのコンテナの場合、たとえばGridListBoxはコンテナによって制約される可能性があります。たとえば、元のコードを次のように変更できます。

<Grid Name="grid1">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="2*"></RowDefinition>
            <RowDefinition Height="*"></RowDefinition>
        </Grid.RowDefinitions>
        <ListBox Grid.Row="0" Name="lstFonts" Margin="3"
                 ItemsSource="{x:Static Fonts.SystemFontFamilies}"/>
    </Grid>
</Grid>

重要なのは直接のコンテナだけではないことに注意してください。あなたの例では、直接のコンテナはですGridが、それGridはに含まれているStackPanelため、外側StackPanelはその直接の子Gridを収容するために拡張され、その子はその子(ListBox)を収容するために拡張できます。

の高さを設定するかListBox、内側の高さを設定するGridか、または単に外側のコンテナをaにすることによって、任意のポイントで高さを制限すると、Gridリストアイテムが多すぎると、垂直スクロールバーが自動的に表示されます。コントロールに収まります。


DockPanelを親コンテナとして使用すると、子として追加する予定の要素の数を知ったり、高さ属性を事前定義したりする必要がなくなります。子ごとに、DockPanel.Dock = Topを定義します。これにより、「Scrollviewer-Childs」に必要に応じてスクロールバーが表示されます。一般的にはテストされていませんが、私のユースケースでは機能しました。BR、ダニエル
dba 2016年

1
TLDR:StackPanelは常に子の高さまで拡張さStackPanelれるGridため、親要素をからに変更します。
JoshNoe19年

17

リストボックスに「高さ」を追加すると、スクロールバーがうまく追加されました。


8
高さと幅のプロパティは、将来の変更を困難にする可能性があるため、使用しないようにしてください。JaredParのソリューションを使用したほうがよいでしょう。
ブライアンアンダーソン

1
私はそれを行いますが、スクロールバー自体がなく、右側に「スクロールバー領域」が配置され、リストがウィンドウの下部を超えて永遠に表示されます。リストボックスにどのように伝えることができますか(ウィンドウの下部で停止します)。 )?
エドワードタンガイ

15
StackPanel内にあるため、必要なすべてのスペースが楽しく与えられているため、スクロールバーは必要ないと思われます
Donnelle

4

スクロールバーは、表示が[非表示]に設定されていない限り、リストボックスに自動的に追加されます。リストアイテムのサイズがリストボックス内に表示されるサイズを超えると、実行時に垂直または水平のリストボックスが表示されます。


1

私の場合、ListBox内のアイテムの数は動的であるため、Heightプロパティを使用したくありませんでした。代わりにMaxHeightを使用しましたが、うまく機能します。スクロールバーは、割り当てたスペースを埋めると表示されます。


0

同じ問題が発生していました。StackPanelにComboBoxの後にListBoxがあり、ListBoxのスクロールバーが表示されませんでした。代わりに2つをDockPanelに入れることで、これを解決しました。ComboBox DockPanel.Dock = "Top"を設定し、ListBoxに残りのスペースを埋めさせます。


0

XAMLリストボックススクローラー-Windows10(UWP)

<Style TargetType="ListBox">
    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" Value="Visible"/>
    <Setter Property="ScrollViewer.VerticalScrollBarVisibility" Value="Visible"/>
</Style>

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.