如何在Windows Phone中显示长长的数据列表?

时间:2011-11-21 11:26:17

标签: windows-phone-7 listbox scrollview

我需要一些允许滚动大量数据的控件。它基本上是一个帮助页面,所以我需要显示很多文本块和图像。

我尝试使用列表框,但它没有提供所需的效果。我尝试将文本块放入每个列表项中,但调整大小所需的texblock将显示完整的文本。最后,texblocks出现在屏幕区域!!

滚动查看器允许我只添加一个文本块

有人可以告诉我该如何去做吗?这是正确的方法吗?或者是否有其他控件允许我这样做? longlistselector做了什么?

Alfah

4 个答案:

答案 0 :(得分:2)

根据您的描述,我不能说您是否无法使用标准控件修复您的要求,因为您需要发布您现在拥有的XAML。

关于LongListSelector,在WindowsPhoneGeek.com上有一篇关于此控件的非常好的两篇文章:

第1部分:http://www.windowsphonegeek.com/articles/wp7-longlistselector-in-depth--part1-visual-structure-and-api

第2部分:http://www.windowsphonegeek.com/articles/wp7-longlistselector-in-depth--part2-data-binding-scenarios

如果此控件适合您的要求,第一篇文章应该会给您一个很好的概述。请注意,codeplex上有Windows Phone Toolkit的新版本修复了长列表选择器的一些问题。

答案 1 :(得分:1)

您可以使用GRID提供的滚动查看器,并可以添加您想要的文本,如下所示:

<Grid Name="ansGrid" Background="Transparent" Grid.Row="3" ScrollViewer.HorizontalScrollBarVisibility="Visible" ScrollViewer.VerticalScrollBarVisibility="Visible">
                <Grid.RowDefinitions>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>
                    <RowDefinition Height="Auto"/>
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="261"/>
                    <ColumnDefinition Width="195*" />
                </Grid.ColumnDefinitions>
                <TextBlock Text="Race Category" FontSize="24" Grid.Row="0" Grid.Column="0" FontWeight="SemiBold"></TextBlock>
                <TextBlock Text="Start Time" FontSize="24" Grid.Row="0" Grid.Column="1" FontWeight="SemiBold"></TextBlock>
                <TextBlock Text="any" FontSize="22" Grid.Row="1" Grid.Column="0"></TextBlock>
                <TextBlock Text="thing" FontSize="22" Grid.Row="1" Grid.Column="1"></TextBlock>
                <TextBlock Text="etc" FontSize="22" Grid.Row="2" Grid.Column="0" TextWrapping="Wrap"></TextBlock>
                <TextBlock Text="etc" FontSize="22" Grid.Row="2" Grid.Column="1"></TextBlock>
            </Grid>

答案 2 :(得分:1)

在这种情况下,您不需要LongListSelector这可能是一种过度杀伤力。您应该坚持使用ListBox控件,因为它提供了自动Virtualization

要很好地布置ListBoxItems,请尝试将边距设置为ListBoxItem(或者可以使用ListBoxItem样式设置)并将样式应用于TextBlock

enter image description here

    <ListBox Grid.Row="1">
        <ListBoxItem Margin="{StaticResource PhoneMargin}">
            <TextBlock TextWrapping="Wrap" Text="Nam quam nunc, blandit vel, luctus pulvinar, hendrerit id, lorem. Maecenas nec odio et ante tincidunt tempus. Donec vitae sapien ut libero venenatis faucibus. Nullam quis ante. Etiam sit amet orci eget eros faucibus tincidunt. Duis leo. Sed fringilla mauris sit amet nibh. Donec sodales sagittis magna. Sed consequat, leo eget bibendum sodales, augue velit cursus nunc" Style="{StaticResource PhoneTextNormalStyle}"/>
        </ListBoxItem>
        <ListBoxItem Margin="{StaticResource PhoneMargin}">
            <TextBlock TextWrapping="Wrap" Text="Nullam dictum felis eu pede mollis pretium. Integer tincidunt. Cras dapibus. Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi. Nam eget dui. Etiam rhoncus. Maecenas tempus, tellus eget condimentum rhoncus, sem quam semper libero, sit amet adipiscing sem neque sed ipsum." Style="{StaticResource PhoneTextNormalStyle}"/>
        </ListBoxItem>
        <ListBoxItem Margin="{StaticResource PhoneMargin}">
            <TextBlock TextWrapping="Wrap" Text="Vivamus elementum semper nisi. Aenean vulputate eleifend tellus. Aenean leo ligula, porttitor eu, consequat vitae, eleifend ac, enim. Aliquam lorem ante, dapibus in, viverra quis, feugiat a, tellus. Phasellus viverra nulla ut metus varius laoreet. Quisque rutrum. Aenean imperdiet. Etiam ultricies nisi vel augue. Curabitur ullamcorper ultricies nisi. Nam eget dui. Etiam rhoncus. Maecenas tempus, tellus eget condimentum rhoncus, sem quam semper libero, sit amet adipiscing sem neque sed ipsum." Style="{StaticResource PhoneTextNormalStyle}"/>
        </ListBoxItem>
        <ListBoxItem Margin="{StaticResource PhoneMargin}">
            <TextBlock TextWrapping="Wrap" Text="Nam quam nunc, blandit vel, luctus pulvinar, hendrerit id, lorem. Maecenas nec odio et ante tincidunt tempus. Donec vitae sapien ut libero venenatis faucibus. Nullam quis ante. Etiam sit amet orci eget eros faucibus tincidunt. Duis leo. Sed fringilla mauris sit amet nibh. Donec sodales sagittis magna. Sed consequat, leo eget bibendum sodales, augue velit cursus nunc" Style="{StaticResource PhoneTextNormalStyle}"/>
        </ListBoxItem>
    </ListBox>

答案 3 :(得分:1)

对于帮助页面,很多时候我发现在项目中嵌入HTML页面并使用WebBrowser控件来显示它是最简单的。例如,请参阅此文章:

http://msdn.microsoft.com/en-us/library/ff431811(v=VS.92).aspx

如果你想避免使用HTML,你也可以尝试新的(尽管文档记录很少)RichTextBox:

http://www.windowsphonegeek.com/articles/Windows-Phone-7-Mango-First-look-at-RichTextBox-control http://msdn.microsoft.com/en-us/library/system.windows.controls.richtextbox%28v=VS.95%29.aspx