none
gridview 显示一行两列,并垂直滚动 RRS feed

  • 问题

  • Hi,all

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

    — — |

    — — 

    — — 

    — — 


    HamGuy | Windows Phone 8


    • 已编辑 HamGuy15 2014年1月14日 5:30
    2014年1月14日 5:29

答案

  • 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.

    • 已标记为答案 HamGuy15 2014年1月15日 4:13
    2014年1月14日 7:03
    版主

全部回复

  • 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.

    • 已标记为答案 HamGuy15 2014年1月15日 4:13
    2014年1月14日 7:03
    版主
  • 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

    2014年1月15日 4:14