[Windows Phone]_解決ListView 第一項 item 消失的問題

昨天再改bug的時候,發現這個奇怪的問題

ListView的寫法照理來說應該十分的老練了,不會錯了

 

這個問題也有在msdn自問自答(英文版):

Listview first item not shown

https://social.msdn.microsoft.com/Forums/windowsapps/en-US/0f138513-4231-4f1d-bf0f-9e0d21b5558d/listview-first-item-not-shown

 

可是昨天卻遇到無論是ListView還是GridView,第一個項目卻消失的問題如下:

568334

 

 

紅色框框為Part: 1的項目,雖然沒有任何的顯示,但卻又可以點擊的到他,這個問題真是十分神奇,以下是C# CODE跟XAML:

<Grid>
                        <ListView x:Name="lv_Content" FlyoutBase.AttachedFlyout="{StaticResource flyout_Resoultion}"  IsItemClickEnabled="True" SelectionMode="Single" ItemClick="lv_Content_ItemClick">

                            <ListView.ItemTemplate>

                                <DataTemplate>
                                    <Grid Width="{Binding ActualWidth , ElementName=lv_Content}" Height="60" Margin="0,0,0,20" >
                                        <Border BorderBrush="#FFB3BBB6" BorderThickness="10,0,0,0" >
                                            <Grid>

                                                <TextBlock Grid.Row="1" TextWrapping="Wrap"  Text="{Binding part}" FontSize="24" Margin="10,0,0,0" FontFamily="Global User Interface" VerticalAlignment="Center"  />

                                            </Grid>

                                        </Border>
                                    </Grid>
                                </DataTemplate>

                            </ListView.ItemTemplate>
                              
                        </ListView>
</Grid>

 

   private void NavigationHelper_LoadState(object sender, LoadStateEventArgs e)
        {
            sdj_temp = e.NavigationParameter as shows_detail_json;

            List<YoutubeVideoId> l_yvd = new List<YoutubeVideoId>() { new YoutubeVideoId() { part = "Part: 1", Id = "1ass" }, new YoutubeVideoId() { part = "Part: 2", Id = "2ass" }, new YoutubeVideoId() { part = "Part: 3", Id = "3ass" } };
            YoutubeVideoId yvd;
            int i = 1; 

            lv_Content.ItemsSource = l_yvd;
        }

        class YoutubeVideoId
        {
            public string part { get; set; }
            public string Id { get; set; }
        }

 

可以看到這是在單純不過的CODE…但怎麼會失靈呢?

 

原因出在

  <ListView.ItemTemplate>
                <DataTemplate>
                      <Grid Width="{Binding ActualWidth , ElementName=lv_Content}" Height="60" Margin="0,0,0,20" >

在NavigationHelper_LoadState的時候大概是UI都還沒初始化吧,這時下中斷點會看到:

2014-11-19_11-28-25

這時ListView是沒有高度及寬度的…但不知道為何只有第一項消失…而其他項目卻可以正常存在

 

要解決這個問題,必須要在頁面都Loaded完之後再來指定ListView的ItemsSource:

2014-11-19_11-29-14

 

這樣就能順利解決這個問題了~

 

以上

Leave a comment

這個網站採用 Akismet 服務減少垃圾留言。進一步瞭解 Akismet 如何處理網站訪客的留言資料