gridview 显示一行两列，并垂直滚动

Question

Hi,all

我想实现如下面示意的一个列表（每个“—”代表一个元素，“|” 表示滚动条），并且要支持垂直滚动，但是尝试用过gridview和listview之后，都只能在水平方向滚动（修改滚动条的各种属性，以及GridView或者是ListView的高宽都不行），请问有什么办法能使其在垂直方向滚动，谢谢！

— — |

— — 

— — 

— — 

---

HamGuy | Windows Phone 8

Answer 1

Hi,

你可以使用WrapGrid 来实现这样的布局，请看下面的例子：

<ListView Height="320" Width="260">
            <ListView.ItemsPanel>
                <ItemsPanelTemplate>
                    <WrapGrid Orientation="Horizontal" MaximumRowsOrColumns="2"/>
                </ItemsPanelTemplate>
            </ListView.ItemsPanel>

            <Rectangle Height="100" Width="100" Fill="Blue" />
            <Rectangle Height="100" Width="100" Fill="Red" />
            <Rectangle Height="100" Width="100" Fill="Yellow" />
            <Rectangle Height="100" Width="100" Fill="Green" />
            <Rectangle Height="100" Width="100" Fill="Gray" />
            <Rectangle Height="100" Width="100" Fill="LightBlue" />
            <Rectangle Height="100" Width="100" Fill="Pink" />
            <Rectangle Height="100" Width="100" Fill="YellowGreen" />
        </ListView>

这样您可以得到一行两列的布局，也可以使Listview里面的content实现垂直滚动的效果。

祝您好运！

---

We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
Click HERE to participate the survey. Thanks<br/> MSDN Community Support<br/> <br/> Please remember to &quot;Mark as Answer&quot; the responses that resolved your issue. It is a common way to recognize those who have helped you, and makes it easier for other visitors to find the resolution later.

Answer 2

Hi,

你可以使用WrapGrid 来实现这样的布局，请看下面的例子：

<ListView Height="320" Width="260">
            <ListView.ItemsPanel>
                <ItemsPanelTemplate>
                    <WrapGrid Orientation="Horizontal" MaximumRowsOrColumns="2"/>
                </ItemsPanelTemplate>
            </ListView.ItemsPanel>

            <Rectangle Height="100" Width="100" Fill="Blue" />
            <Rectangle Height="100" Width="100" Fill="Red" />
            <Rectangle Height="100" Width="100" Fill="Yellow" />
            <Rectangle Height="100" Width="100" Fill="Green" />
            <Rectangle Height="100" Width="100" Fill="Gray" />
            <Rectangle Height="100" Width="100" Fill="LightBlue" />
            <Rectangle Height="100" Width="100" Fill="Pink" />
            <Rectangle Height="100" Width="100" Fill="YellowGreen" />
        </ListView>

这样您可以得到一行两列的布局，也可以使Listview里面的content实现垂直滚动的效果。

祝您好运！

---

We are trying to better understand customer views on social support experience, so your participation in this interview project would be greatly appreciated if you have time. Thanks for helping make community forums a great place.
Click HERE to participate the survey. Thanks<br/> MSDN Community Support<br/> <br/> Please remember to &quot;Mark as Answer&quot; the responses that resolved your issue. It is a common way to recognize those who have helped you, and makes it easier for other visitors to find the resolution later.

非常感谢版主的悉心指点！

---

HamGuy | Windows Phone 8