How to hide label if the binding does not hold a value?

I have a list view in xamarin forms, which in turn contains a set of labels. But I want these labels to be dynamic. The labels should be displayed only if the bindings hold some value. Here's the code snippet:
Code Behind
res1 = await manager.NumberOfOrders(text); var res2 = await manager.GetOrders(text, "True"); OrderList = new ObservableCollection<Orders>(); foreach (var item in res2) { OrderList.Add(item); } MainListView.ItemsSource = OrderList;

Xaml Code Snippet:
<ContentPage.Content> <ListView x:Name="MainListView" HasUnevenRows="True"> <ListView.ItemTemplate> <DataTemplate> <ViewCell> <Grid VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand" Padding="20,20,20,20"> <Grid.RowDefinitions> <RowDefinition Height="*"></RowDefinition> <RowDefinition Height="*"></RowDefinition> <RowDefinition Height="*"></RowDefinition> <RowDefinition Height="*"></RowDefinition> <RowDefinition Height="*"></RowDefinition> </Grid.RowDefinitions> <Grid.ColumnDefinitions> <ColumnDefinition Width="*"></ColumnDefinition> <ColumnDefinition Width="*"></ColumnDefinition> </Grid.ColumnDefinitions> <Label Text="Id" Grid.Row="0" Grid.Column="0" TextColor="Maroon" /> <Label Text="{Binding Id}" Grid.Row="0" Grid.Column="1" TextColor="Maroon"/> <Label Text="Furniture Name" Grid.Row="1" Grid.Column="0" TextColor="Maroon" /> <Label Text="{Binding FurnitureName1}" Grid.Row="1" Grid.Column="1" TextColor="Maroon"/> <Label Text="Furniture Name" Grid.Row="2" Grid.Column="0" TextColor="Maroon" /> <Label Text="{Binding FurnitureName2}" Grid.Row="2" Grid.Column="1" TextColor="Maroon"/> <Label Text="Furniture Name" Grid.Row="3" Grid.Column="0" TextColor="Maroon" /> <Label Text="{Binding FurnitureName3}" Grid.Row="3" Grid.Column="1" TextColor="Maroon"/>
I want these labels to be dynamic. How can I achieve this using my code behind? Also, is there a way to

Best Answers

  • JulienRosenJulienRosen CA ✭✭✭✭
    edited July 2016 Accepted Answer

    Maybe you should consider using a GroupedListView. This will give you section headers, then a dynamic list of child elements.

    I would also suggest you reconsider your design. Your list of items should show only primary information, and then tapping one would bring you to a details view that shows all the other potentially optional information.

Answers

  • AlessandroCaliaroAlessandroCaliaro ITMember ✭✭✭✭✭

    Which Labels you want to be "dynamic" ? what do you mean for Dynamic?

  • JulienRosenJulienRosen CAMember ✭✭✭✭
    edited July 2016 Accepted Answer

    Maybe you should consider using a GroupedListView. This will give you section headers, then a dynamic list of child elements.

    I would also suggest you reconsider your design. Your list of items should show only primary information, and then tapping one would bring you to a details view that shows all the other potentially optional information.

  • The labels I have created here are what I call static, i.e. I am creating a predefined set of labels, which may or not have a binding context associated it. I want these labels to be created for items in OrderList. What I want to do is fetch the items in OrderList and create the labels accordingly. Does this answer your doubt ?

  • @Julien rosen, that is exactly what I want to do. But there's only one doubt remaining, the children can be added dynamically, right? I mean according to the elements in the OrderList?

  • JohnHardmanJohnHardman GBUniversity mod

    @charubansal.4229 - Why not set ItemsSource to a list that just contains the items you want to display? When you want additional items displayed, you add them to the list, when you want them hidden you remove them from the list. Whilst you might also maintain a list that contains every possible item (if you have a reason to), the list you assign to the ItemsSource property is just those ones that you want to be displayed.

  • JulienRosenJulienRosen CAMember ✭✭✭✭

    @charubansal.4229 the problem is what you are asking for is a listview in a listview. a listview allows you to make dynamic lists. but nested listviews are unsupported. when you are in a situation where you have a dynamic list of items, each of which has a dynamic list of children, you need a details screen to show the details listview.

  • AlessandroCaliaroAlessandroCaliaro ITMember ✭✭✭✭✭

    U> @JohnHardman said:

    @charubansal.4229 - Why not set ItemsSource to a list that just contains the items you want to display? When you want additional items displayed, you add them to the list, when you want them hidden you remove them from the list. Whilst you might also maintain a list that contains every possible item (if you have a reason to), the list you assign to the ItemsSource property is just those ones that you want to be displayed.

    using an ObservableCollection

  • @JulienRosen I prefer creating a single details view and changing the content dynamically. The reason I am emphasing on dynamic is that the list of items in the OrderList will not be know beforehand. Is there a way to achieve this. Also, if inconvenient , can you redirect me to a link from where I can get to know about this, since I will be needing a lot of listviews in the app.

  • JulienRosenJulienRosen CAMember ✭✭✭✭
    edited July 2016

    Your example shows a listview, and each item's details in one page. So I'm not sure what you mean when you say a single details view, since right now you do not have a details view at all.

    You use a ListView to display a list of items that will not be known beforehand by populating an ObservableCollection and binding it to your listview.

  • I have a ListView with a list of items. Now each item in that ListView should have a property that when it is selected, it should open some sort of page or something on those lines to show the contents within that item. The items are actually json objects which each have some values to be displayed. It is precisely these values which I want to display, and cannot find a way to implement. I get it that nested listview is not supported, so now i have begun looking at observable collection. Is there a way to display the items in observable collection on the UI?

  • JohnHardmanJohnHardman GBUniversity mod

    @charubansal.4229 - can you draw one or two pictures of how you want the UI to look? That way, we can suggest an appropriate implementation method.

  • image
    Here, I want ID to be an item in listview, and Furniture Names should appear when I click/select ID 1 from the listview. This is the case when there is only a single ID. When there are multiple IDs, then some null values show a blank ,which is logically correct, but it would have been better if I do not create a label in the first place (this is what I mean by dynamic creation of labels). I want a way in which either we can hide the label altogether or redirect to the same page, where the contents are updated automatically, based on the number of furniture. The following snapshot should provide an insight into something which i want to resolve (the third field (furniture name) should not be displayed if no binding context exists) :
    image

  • JohnHardmanJohnHardman GBUniversity mod
    edited July 2016

    @charubansal.4229

    These images are presumably what you have now. What would be useful are images (hand drawn on paper and scanned would do) of how you want them to look. In the absence of those...

    Do you want the initial screen to just show the following?
    Id 1
    Id 2
    Id 3
    Id 4

    and then, when the user taps on Id 1, the following rows appear?
    Furniture Name Coffee Table
    Furniture Name TV Stand
    Furniture Name Deluxe Sofa

    and then, when the user taps on Furniture Name Coffee Table, a details screen appears?

    Is that what you want?

    Can the following bit be on a new page or do you want these bits to appear in the initial list?
    Furniture Name Coffee Table
    Furniture Name TV Stand
    Furniture Name Deluxe Sofa

  • JulienRosenJulienRosen CAMember ✭✭✭✭

    ListView of items

    Select an item

    Pop new page onto stack

    Listview of item details

  • AlessandroCaliaroAlessandroCaliaro ITMember ✭✭✭✭✭
  • AlessandroCaliaroAlessandroCaliaro ITMember ✭✭✭✭✭

    You can also set IsVisible property of "Furniture Name Coffee Table" to a bindable boolean value and, when the ItemSelected is rised, set thit boolean value to true so "Furniture Name Coffee Table"will appear

  • @JohnHardman that's exactly what it should be like. However, there shouldn't be any further navigation, i.e. there should not be any new page after the furniture names have been displayed. So effectively, the navigation stops after displaying the furniture names. But these furniture names which appear depend on the ID, since a particular set of furniture are associated with a particular ID. This pretty much sums it all.

  • JohnHardmanJohnHardman GBUniversity mod

    @charubansal.4229 - Sorry, I'm still not clear.

    (1) Can the list of furniture names appear on a new page, or do they have to be part of the original list?
    (2) Does tapping on a furniture name result in anything happening (e.g. a new page appearing with more detail)? I think you are saying no to this?

    And one additional question:

    (3) Will you want to display anything other than just one line of text per item? (just trying to work out if row heights will all be the same, or whether they may be uneven)

  • (1) The list of furniture can appear on a new page , but the issue that bothers me is that I would need to update the content of the page as and when IDs change.

    (2) No, tapping a furniture name does not result in anything happening.

    (3) There can be multiple furniture pertaining to a single ID.

  • @JohnHarman I'll definitely go through what you suggested. Thanks a lot for helping me with this.

Sign In or Register to comment.