2017-06-05 61 views
0

我有一個listview有三個不同的單元格內容,通過綁定檢查,只有一個顯示在單元格中。我沒有設置視圖單元格的高度,但將其堆棧佈局子項的垂直選項設置爲「填充」。現在,這可以在android上運行,但神祕的不是iOs。我已經將hasuneven行設置爲true,但是在點擊每個單元格時,我注意到高度是相同的。我將展示的XAML代碼和項目源代碼:Listview HasUnEvenRows不工作

<ListView 
     x:Name = "lvConversations" 
     VerticalOptions = "FillAndExpand" 
     HorizontalOptions = "FillAndExpand" 
     IsGroupingEnabled = "false" 
     SeparatorVisibility = "None" 
     HasUnevenRows = "true" 
     ItemSelected = "messageSelected" 
     BackgroundColor = "#F8F8F8" 
     > 

     <ListView.ItemTemplate> 
      <DataTemplate> 
       <local:ScaledViewCell> 
       <local:ScaledStackLayout 
        VerticalOptions = "Fill" 
        HorizontalOptions = "FillAndExpand" 
        Orientation = "Vertical" 
        Spacing = "0"> 

        <local:ScaledStackLayout 
         VerticalOptions = "Fill" 
         HorizontalOptions = "FillAndExpand" 
         Orientation = "Vertical" 
         Spacing = "0" 
         IsVisible = "{Binding isGroupHeader, Converter = {StaticResource inverter}}" 
         BackgroundColor = "Transparent"> 

         <!-- OUTGOING --> 
          <local:ScaledStackLayout 
           HorizontalOptions = "FillAndExpand" Orientation = "Horizontal" 
           IsVisible = "{Binding isOutgoing}"> 


            <local:ScaledStackLayout 
             VerticalOptions = "Fill" 
             HorizontalOptions = "EndAndExpand" 
             BackgroundColor = "Transparent" 
             Orientation = "Vertical" 
             Margin = "21,14,15,0" 
             Spacing = "0"> 

             <local:ScaledStackLayout 
              Orientation = "Horizontal" 
              VerticalOptions = "Fill" 
              HorizontalOptions = "EndAndExpand" 
              Spacing = "0" 
              > 
              <local:CorneredView 
               CornerRadius = "15" 
               BackgroundColor = "#d3eaf6" 
               VerticalOptions = "Fill" 
               HorizontalOptions = "End" 
               > 
               <Label 
                VerticalOptions = "Fill" 
                HorizontalOptions = "Fill" 
                Text = "{Binding message}" 
                FontSize = "10" 
                TextColor = "Black" 
                Margin = "7,10,7,10" 
                LineBreakMode = "WordWrap" 
               /> 

              </local:CorneredView> 
              <Image 
               Margin = "0,11,7,0" 
               Source = "ic_msg_arrow_outgoing" 
               WidthRequest = "5" 
               HeightRequest = "10" 
               Aspect = "AspectFit" 
               BackgroundColor = "Transparent" 
               VerticalOptions = "Start" 
               /> 
              <ffimageloading:CachedImage 
               WidthRequest = "37" 
               HeightRequest = "37" 
               BackgroundColor = "Transparent" 
               VerticalOptions = "Start" 
               Aspect = "AspectFill" 
               Source = "{Binding sender.imageUrl}" 
               DownsampleToViewSize = "true" 
               DownsampleUseDipUnits = "true" 
               > 

               <ffimageloading:CachedImage.Transformations> 
               <fftransformations:CircleTransformation> 
                <x:Arguments> 
                 <x:Double>2</x:Double> 
                 <x:String>#FF8A07</x:String> 
                </x:Arguments> 
               </fftransformations:CircleTransformation> 
               </ffimageloading:CachedImage.Transformations> 

             </ffimageloading:CachedImage> 

             </local:ScaledStackLayout> 

             <Label 
              Margin = "0,3,0,0" 
              VerticalOptions = "Center" 
              HorizontalOptions = "Start" 
              Text = "{Binding formattedDateSent}" 
              HeightRequest = "10" 
              FontSize = "8" 
              TextColor = "#4D212121"/> 
            </local:ScaledStackLayout> 


          </local:ScaledStackLayout> 

         <!--INCOMING--> 
         <local:ScaledStackLayout 
          WidthRequest = "284" 
          VerticalOptions = "Fill" 
          BackgroundColor = "Transparent" 
          Orientation = "Vertical" 
          Margin = "15,14,21,0" 
          Spacing = "0" 
          IsVisible = "{Binding isOutgoing, Converter = {StaticResource inverter}}"> 

          <local:ScaledStackLayout 
           Orientation = "Horizontal" 
           WidthRequest = "284" 
           VerticalOptions = "Fill" 
           Spacing = "0" 
           > 
           <ffimageloading:CachedImage 
            WidthRequest = "37" 
            HeightRequest = "37" 
            BackgroundColor = "Transparent" 
            VerticalOptions = "Start" 
            Aspect = "AspectFill" 
            Source = "{Binding sender.imageUrl}" 
            DownsampleToViewSize = "true" 
            DownsampleUseDipUnits = "true" 
            > 
            <ffimageloading:CachedImage.Transformations> 
             <fftransformations:CircleTransformation> 
              <x:Arguments> 
               <x:Double>2</x:Double> 
               <x:String>#FF8A07</x:String> 
              </x:Arguments> 
             </fftransformations:CircleTransformation> 
            </ffimageloading:CachedImage.Transformations> 
           </ffimageloading:CachedImage> 

           <Image 
            Margin = "7,15,0,0" 
            Source = "ic_msg_arrow_incoming" 
            WidthRequest = "5" 
            HeightRequest = "10" 
            Aspect = "AspectFit" 
            BackgroundColor = "Transparent" 
            VerticalOptions = "Start" 

            /> 
           <local:CorneredView 
            WidthRequest = "235" 
            VerticalOptions = "Fill" 
            CornerRadius = "15" 
            BackgroundColor = "#ECECEC" 
            IsClippedToBounds = "true" 
            > 
            <Label 
             VerticalOptions = "Fill" 
             HorizontalOptions = "FillAndExpand" 
             Text = "{Binding message}" 
             FontSize = "10" 
             TextColor = "Black" 
             Margin = "7,10,7,10" 
             LineBreakMode = "WordWrap" 
            /> 

           </local:CorneredView> 
          </local:ScaledStackLayout> 

          <Label 
           Margin = "0,3,0,0" 
           VerticalOptions = "Center" 
           HorizontalOptions = "End" 
           Text = "{Binding formattedDateSent}" 
           HeightRequest = "10" 
           FontSize = "8" 
           TextColor = "#4D212121"/> 

         </local:ScaledStackLayout> 

        </local:ScaledStackLayout> 
        <!--Message Group--> 
        <local:ScaledStackLayout 
         Margin = "0" 
         Padding = "0" 
         Spacing = "0" 
         Orientation = "Vertical" 
         VerticalOptions = "Fill" 
         IsVisible = "{Binding isGroupHeader}" 
         BackgroundColor = "Transparent" 
         > 
         <!--label and button--> 
         <local:ScaledStackLayout 
          Margin = "9,0,9,0" 
          HeightRequest = "19" 
          Orientation = "Horizontal" 
          Padding = "0,5,7,0" 
          BackgroundColor = "Transparent"> 

          <Label 
           Text = "{Binding groupHeaderTitle}" 
           HorizontalOptions = "FillAndExpand" 
           HeightRequest = "8" 
           FontSize = "8" 
           TextColor = "#212121" 
           VerticalTextAlignment = "Center" 
           HorizontalTextAlignment = "Center" 
           BackgroundColor = "Transparent"/> 

         </local:ScaledStackLayout> 

         <BoxView 
          Margin = "9,0,9,0" 
          HorizontalOptions = "FillAndExpand" 
          HeightRequest = "1" 
          BackgroundColor = "#4D212121"/> 


        </local:ScaledStackLayout> 

        </local:ScaledStackLayout> 
       </local:ScaledViewCell> 
      </DataTemplate> 
     </ListView.ItemTemplate> 

    </ListView> 

我還會附上照片上都Android和iOS Andrioid Page iOs Page

正如你所看到的,細胞重疊。

我用來填充列表視圖中的代碼是這樣的:

public void OnSuccess(JObject response, BaseAPI caller) 
{ 
    if (Constants.isDebug) 
    { 

     JObject json = TestData.getTestData("conversation_messages_listed.json"); 
     response = json; 
    } 



    ObservableCollection<Message> arrMessages = JsonConvert.DeserializeObject<ObservableCollection<Message>>(response["messages"].ToString(), new JsonSerializerSettings() 
    { 
     NullValueHandling = NullValueHandling.Ignore, 
     MissingMemberHandling = MissingMemberHandling.Ignore 
    }); 

    lvConversations.ItemsSource = arrMessages; 
} 

請幫幫忙,我是新來xamarin。

+0

很難說沒有ScaledStackLayout,ScaledViewCell和可能CorneredView的代碼,如果你想提供樣本來重現問題,它可能會加速解決方案。 –

+0

這些只是Stacklayout,視單元和框架的簡單子類。除超類外沒有太多變化,只是它們根據設備屏幕尺寸縮放它們的大小。我在應用程序的其他頁面上使用它,所以我很確定它不在導致問題的那些頁面上。 – MetaSnarf

+0

我需要編寫大量代碼來重現(消息類,轉義等)。如果您仍然需要幫助,請提供示例項目。 –

回答

0

HasUnevenRows在iOS上默認不起作用。看到這個comment on a bug report

iOS不支持自動調整行單元格的大小,你必須設置一個ListView.RowHeight或一個Cell.Height。不幸的是,我們並沒有明確禁止使用Android或Windows Phone(在沒有我們的干預的情況下它可以正常工作),並且導致一些人認爲iOS在這方面存在問題。

不幸的是,這是iOS平臺的限制,因此是預期的行爲。

查看docs for HasUnevenRows property也許有幫助。

當應用程序開發人員將ListView.HasUnevenRows屬性設置爲true時,列表視圖的行爲仍然依賴於ListView.RowHeight屬性。首先,如果開發人員不設置ListView.RowHeight屬性或將其設置爲-1,則列表視圖項目會自動調整以適合其內容。如上所述,這是期望的行爲和ListView.HasUnevenRows值爲true的預期用例。其次,如果開發人員將ListView.RowHeight屬性設置爲0或除-1之外的負值,則ListView中的所有行都將與系統內容的高度無關,而與其內容的高度無關。第三,最後,如果開發人員將ListView.RowHeight設置爲正值,那麼ListView中的所有行將與ListView.RowHeight一樣高,而不管其內容的高度如何,就好像ListView.HasUnevenRows已設置爲假。