Can you have dynamic cell heights with either the ListView or TableView views?

2

Answers

  • Anurag.9113Anurag.9113 USMember ✭✭

    Seriously, how messed up this is. Xamarin forms 2.X and the solution still does not work. WHY?

  • BhaurajBiradarBhaurajBiradar USUniversity ✭✭

    @JeroenBoumans.6481 - Thank you, It worked for me..

  • rughvi8784rughvi8784 GBMember ✭✭

    Any

  • vinodkumarvinodkumar INMember ✭✭

    Below code worked for me,

    protected override void OnAppearing()
    {
    base.OnAppearing();
    listViewOrderCloths.HeightRequest = (model.ListOrderedCloths.Count*100)/2 ;
    }

  • AlexHaleAlexHale INMember

    Hello Working for me :)

    public override UIKit.UITableViewCell GetCell (Cell item, UITableViewCell reusableCell, UITableView tv)
    {

        var cell = base.GetCell (item, reusableCell, tv)      
        tv.RowHeight = UITableView.AutomaticDimension;
        tv.EstimatedRowHeight = 200;
        return cell;
    }
    
  • Is this discussion about whether ListView/TableView support auto row height calculation at startup? OR dynamic row height calculation at runtime if the cell content changes?

    I don't know about the second question for dynamically changing cell content at runtime, but I do know that the first question is yes (after BUG 39486 was fixed, https://bugzilla.xamarin.com/show_bug.cgi?id=39486 )

    On iOS >=8, in order for ListView and TableView to auto calculate row heights at startup, you MUST do 2 things:
    1. use a custom cell class
    2. set HasUnevenRows = true

    This was true for ListView but NOT for TableView until BUG 39486 was fixed. On Android, it always worked for me regardless of these two items since WrapContent is built into Android.

    Attached is a test program for iOS for that bug that shows the 4 combinations and the output of each. The last test row demonstrates the problem with TableView and shows that the complete bug fix for 39486 is still not in Xamarin.Forms 2.3.0.49.

  • TonyTruppTonyTrupp USUniversity ✭✭

    Switching the ListView's hasUnevenRows to false then true again fixed it for me

  • JohnHardmanJohnHardman GBUniversity mod

    @AlexHale - does that piece of code result in the cell height changing dynamically when the content of a cell changes (via data binding)?

  • AlexHaleAlexHale INMember

    @JohnHardman - Yup.. you can changing cell height dynamically as like this.

    public override UIKit.UITableViewCell GetCell (Cell item, UITableViewCell reusableCell, UITableView tv)
    {
    var SiteItems = item.BindingContext as Sites;
    var cell = base.GetCell (item, reusableCell, tv);
    try {
    if (SiteItems.IsSelected) {
    tv.RowHeight = UITableView.AutomaticDimension;
    tv.EstimatedRowHeight = 200;
    }
    else
    {
    tv.RowHeight = UITableView.AutomaticDimension;
    tv.EstimatedRowHeight = 80;
    }
    } catch (Exception ex) {
    ex.SendErrorLog ();
    }
    return cell;
    }

  • JohnHardmanJohnHardman GBUniversity mod
    edited June 2016

    @AlexHale - Sorry, I'm still unclear about that. If I have a ViewCell that contains a layout that contains a Label with word-wrapped text, and the text of that Label is populated by data-binding, if the data changes and so the length of the text changes and the number of rows that the word-wrapped Label requires changes, will the code above automatically resize the ViewCell to the correct height to completely contain the updated layout & Label (without any unnecessary space)?

  • AlexHaleAlexHale INMember

    @JohnHardman - For that you can set HasUnevenRows = true.

  • JohnHardmanJohnHardman GBUniversity mod

    @AlexHale - HasUnevenRows on its own doesn't do it on iOS. Extra work is required to make it work on iOS, even though automatic row heights work a dream on other platforms (usually).

  • ShawnCastrianni.5092ShawnCastrianni.5092 US ✭✭✭
    edited June 2016

    Strange behavior. Attached is a small test program to show some of the weirdness here:

    1. If I use a Grid for the main layout of my ViewCell, neither Android nor iOS dynamically adjusts the row height
    2. If I use a StackLayout for the main layout of my ViewCell, then Android works correctly, but iOS requires me to scroll the changed cell off the screen to force it to redraw and adjust its height.

    I prefer Grid since it has less layout bugs compared to StackLayout so the above results are unfortunate.

    NOTE: For those that don't know, auto calculating row heights (even for the initialization of the ListView, not dynamically changing) on iOS REQUIRE a custom cell class. This is because the default forms cells use the default iOS UITableViewCell which does NOT support auto row height feature of iOS8.

  • JohnHardmanJohnHardman GBUniversity mod

    @ShawnCastrianni.5092 - Yes, Grid as the main layout in a ViewCell has some extra complications.

    I've moved most of my ListView code over to use DataTemplates now. When I get time, I'm going to do one additional tweak to see whether an expander/contractor button can be handled on a cell by using two DataTemplates (one for expanded, one for contracted) , then removing the corresponding data item from the data collection and then re-inserting it with a flag that results in the template selector choosing the other DataTemplate. I'm hoping that will result in the row height being updated, without any scrolling. I'll update here when I get time to try it. It's completely unnecessary on other platforms, it's just iOS that needs it.

  • BaoDinhBaoDinh USMember

    @JeroenBoumans.6481 said:
    This worked for me:

    HasUnevenRows = true, RowHeight = -1,

    It works. How can i set height viewcell is 100% fit with screen ???

  • sdonaldsonsdonaldson CAMember ✭✭

    @JeroenBoumans.6481 said:
    This worked for me:

    HasUnevenRows = true, RowHeight = -1,

    Thank you @JeroenBoumans.6481 - this worked for me, after days of banging my head against a wall of course.

  • JeroenBoumansJeroenBoumans NLMember

    @sdonaldson glad it gave your wall a little break :wink:

  • moreirawebmastermoreirawebmaster BRMember ✭✭

    @JeroenBoumans.6481 said:
    This worked for me:

    HasUnevenRows = true, RowHeight = -1,

    Great job man! worked for me!

  • JeroenBoumansJeroenBoumans NLMember
    edited August 2016

    @BaoDinh said:

    @JeroenBoumans.6481 said:
    This worked for me:

    HasUnevenRows = true, RowHeight = -1,

    It works. How can i set height viewcell is 100% fit with screen ???

    Hi @BaoDinh , I don't think it is possible to do it like that with a standard value. But if you want to do it I would use the device height. You can do this by settings global variables at the initialization of you app. I gather my device screen dimensions like this:

    Put this in your App.cs

    public class App : Application { static public int ScreenWidth; static public int ScreenHeight; ...

    Because the App.cs is known by the Droid and iOS folder you can do this:

    Put this in the Android folder in the file MainActivity.cs (or the activity the app starts with):

    public class MainActivity : FormsApplicationActivity { protected override void OnCreate (Bundle bundle) { base.OnCreate (bundle); App.ScreenWidth = (int)(Resources.DisplayMetrics.WidthPixels / Resources.DisplayMetrics.Density); App.ScreenHeight = (int)(Resources.DisplayMetrics.HeightPixels / Resources.DisplayMetrics.Density); ...

    And in iOS folder in the AppDelegate.cs:

    [Register ("AppDelegate")] public partial class AppDelegate : global::Xamarin.Forms.Platform.iOS.FormsApplicationDelegate { public override bool FinishedLaunching (UIApplication app, NSDictionary options) { global::Xamarin.Forms.Forms.Init (); App.ScreenWidth = (int)UIScreen.MainScreen.Bounds.Width; App.ScreenHeight = (int)UIScreen.MainScreen.Bounds.Height; ...

    the App.ScreenWidth (and .Height) do have a value now when the app initialises and can now be set into the rowheight property instead of -1. Ofcourse when the screen rotation changes these values have to be update.

    RowHeight = App.ScreenHeight

    Haven't tested it myself but I think this should be the way to do it. Hope this helps you a little further :smile:

  • XamDXamD PKMember

    @TheRealJasonSmith
    Still Problem!!!!!!
    Xamarin.Forms, iOS: Changing the dynamic height of cell in OnAppearing method didn't worked for me but after scroll cell height is adjusted.
    Come on Xamarin guys this little annoying issue still exists. No work around is working for me. I have tried almost every possible solution.

    @JeroenBoumans Unfortunately, your solution also didn't worked for me.

  • JeroenBoumansJeroenBoumans NLMember
    edited September 2016

    @XamD said:
    @TheRealJasonSmith
    Still Problem!!!!!!
    Xamarin.Forms, iOS: Changing the dynamic height of cell in OnAppearing method didn't worked for me but after scroll cell height is adjusted.
    Come on Xamarin guys this little annoying issue still exists. No work around is working for me. I have tried almost every possible solution.

    @JeroenBoumans Unfortunately, your solution also didn't worked for me.

    @XamD It seems like you're setting the properties in OnAppearing. I'm not sure if this works though. Have you tried it when the page initializes? Try creating a list in the constructor and see if it works. Like:

    public class FeedPage : ContentPage { ListView articlesList; public FeedPage() { articlesList = new ListView() { HasUnevenRows = true, RowHeight = -1, ItemsSource = ..., IsRefreshing = false, ItemTemplate = cellTemplate, BindingContext = ..., }; } }

    Also as a tip: try using the BindingContext. When this changes, an event will be dispatched. So, when the content changes the rows should resize. Try doing this instead in OnApprearing. Not sure if this will work but it's just a thought/workaround.

  • GadiPazGadiPaz ILUniversity

    Any news about it?
    I'm still having this problem after trying all of those solutions.
    On Windows Phone 8.1 it works perfect, the problem is with iOS, only when I scroll the rows out of the screen the rows get the appropriate height.
    Any solution from Xamarin?

  • BjarkeSogaardBjarkeSogaard USMember ✭✭

    I'm just sharing knowledge here, but what generally seems to work for me, is to ensure the HasUnevenRows is set to True, RowHeight is set to -1, and the ViewCells child is a Grid layout. You can make whatever UI you want inside that grid layout, but the top-most layout of the view cell must be a Grid layout.

    I say this, because I tried using a StackLayout, and it was didn't seem to care at all then. It just gave me the default 44 height row in that case. However Grid worked. Hope this helps some people.

  • MaximTkMaximTk USMember ✭✭

    I found that if you create your custom cell then row height is incorrect. But if you create it in-place then everything is ok.

  • van8tkavan8tka RUMember ✭✭

    @JeroenBoumans.6481 said:
    This worked for me:

    HasUnevenRows = true, RowHeight = -1,

    It is really work! Thank's so mutch!
    That is in XAML:
    <ListView x:Name ="wordsList" ItemsSource="{Binding}" ItemSelected ="OnItemSelected" HasUnevenRows = "true" RowHeight = "-1">

  • batmacibatmaci DEMember ✭✭✭✭✭

    you just watch the xamarin events 2016 and they suggest you many bullshits to optimize your list view performance.
    dont use stacklayout into stacklayout when you can achieve with grid blabla.. as if you can achieve the layout you want with a grid. I had to use 6 stacklayouts to achieve an listview i wanted. I know that it is better to use a grid instead. freaking grid is just not working inside a listview and xamarin doesnt even care about it.

  • ShawnCastrianniShawnCastrianni USBeta ✭✭✭
    i use Grid exclusively and never have problems in listview or table view.
  • batmacibatmaci DEMember ✭✭✭✭✭
    > @ShawnCastrianni said:
    > i use Grid exclusively and never have problems in listview or table view.

    Do you have unevenrows and do you have dynamic height width where you expect * to fill the unused space. If you have hardcoded width and height of columns for sure you will not have any Problem but it is also not A solution because of many different Screen sizes you need to adopt
  • ShawnCastrianniShawnCastrianni USBeta ✭✭✭

    @batmaci Yes, I have HasUnevenRows = true and I use complex star sizing for my rows and columns. It all works fine on Android and iOS. maybe you are trying a different platform?

  • JulienRosenJulienRosen CAMember ✭✭✭✭

    @batmaci i also have complex listview templates with unevenrows. you should not having any issues using a grid.

  • ThomasAntlingerThomasAntlinger ATMember ✭✭

    @JeroenBoumans.6481 said:
    This worked for me:

    HasUnevenRows = true, RowHeight = -1,

    Help for me! :) Thanks a lot.

  • ShimmyWeitzhandlerShimmyWeitzhandler USMember ✭✭✭

    Same here

  • @ShawnCastrianni.5092 said:
    Strange behavior. Attached is a small test program to show some of the weirdness here:
    2. If I use a StackLayout for the main layout of my ViewCell, then Android works correctly, but iOS requires me to scroll the changed cell off the screen to force it to redraw and adjust its height.

    I have noticed the same for custom cells when either cell has context actions or ListView virtualization mode is Recycle. In both cases Xamarin wraps the cell into ContextActionsCell and that is where it all goes wrong. I have debugged Xamarin.Forms and looks like fixed the issue. Not sure it is a proper fix but here is PR: https://github.com/xamarin/Xamarin.Forms/pull/787

  • TheosTheos NLBeta ✭✭

    I just found out that there's also a different behaviour between an iPhone5(s)/SE or an iPhone6/7. The height of the rows is correct on the 6/7 but I've got issued on the iPhone5/SE.
    I've tried all kind of layouts, all are messed up on the 5/SE device. Looks like it's related to the width of the screen.

  • MAmmarMAmmar USMember ✭✭

    Hi, I want to set text size of the button according to screen size. If the height of the screen is large then text size increases accordingly and similarly if size decreases then the size of text also. I find the height and width of the screen but can not make such formula that can work for all types of screen. Any suggestions?

  • johnashjohnash USMember

    Thanks this worked too me and I changed the size of row

    HasUnevenRows = true, RowHeight = -1,

  • This worked for me:

    HasUnevenRows = true, RowHeight = -1,

    Thanks

  • Mateus.3025Mateus.3025 USMember ✭✭

    ForceUpdateSize does not work for my Recycle Element type list when i expand elements(+/-)

    see sample:
    Https://developer.xamarin.com/samples/xamarin-forms/UserInterface/ListView/DynamicUnevenListCells/

    Can someone help me?

  • ThomasBowenThomasBowen USMember ✭✭

    @JeroenBoumans.6481 said:
    This worked for me:

    HasUnevenRows = true, RowHeight = -1,

    I can't believe after loads of messing around this is the answer. Thank you.

Sign In or Register to comment.