Need some control for displaying Multiple columns in a ListView (almost like FlowListView)

EEstEEst Member ✭✭
edited August 14 in Xamarin.Forms

Need some control for displaying Multiple columns in a ListView (almost like FlowListView) but kinda different.
Need to have columns of a fixed Width but don't want to demand a row to have entirely the same height....

Let me rephrase it.. I want to achieve something like a Tetris Layout, almost like treating each Column as an Independent ListView..

Also i am new to xamarin so sorry if this makes a silly question.. :neutral: :sweat_smile:

Answers

  • JarvanJarvan Member, Xamarin Team Xamurai

    displaying Multiple columns in a ListView...to have entirely the same height....

    To display multiple columns in ListView, you can add a StackLayout and set orientation to horizontal in ViewCell, or use a Grid. Set HasUnevenRows to true, to indicate whether this ListView element has uneven rows.

    <ListView x:Name="listview" HasUnevenRows="True">
        <ListView.ItemTemplate>
            <DataTemplate>
                <ViewCell>
                    <StackLayout Orientation="Horizontal">
                        <Image Source="grid_" Margin="5" HeightRequest="25"/>
                        <Label Text="{Binding content}" />
                    </StackLayout>
                </ViewCell>
            </DataTemplate>
        </ListView.ItemTemplate>
    </ListView>
    

  • Xami3Xami3 PKMember, University ✭✭✭
  • EEstEEst Member ✭✭
    edited August 15
    > @Jarvan said:
    > displaying Multiple columns in a ListView...to have entirely the same height....
    >
    >
    >
    >
    >
    > To display multiple columns in ListView, you can add a StackLayout and set orientation to horizontal in ViewCell, or use a Grid. Set HasUnevenRows to true, to indicate whether this ListView element has uneven rows.
    >
    > <label> </label>

    @Jarvan Actually what i am trying is to get rid of this gaps
  • EEstEEst Member ✭✭
    @Xami3 I will test that tool right now! Thanks! Will let u know if was helpfull!
  • EEstEEst Member ✭✭
    edited August 15
    @Xami3 i checked out Syncfusion DataGrid it seems to be a powerful tool but i think it doesn't explicity solve my problem... What i am trying to do exactly is to show a collection of images in several columns but making this expression always true:

    - for every i (row), j(column) in DataMatrix:
    Element at i, j will be an image showed in full proportion with a fixed width.
    Element at i, j will be 2px away from element at i, j (given j>0)
  • EEstEEst Member ✭✭

    @EEst said:
    @Xami3 i checked out Syncfusion DataGrid it seems to be a powerful tool but i think it doesn't explicity solve my problem... What i am trying to do exactly is to show a collection of images in several columns but making this expression always true:

    • for every i (row), j(column) in DataMatrix:
      Element at i, j will be an image showed in full proportion with a fixed width.
      Element at i, j will be 2px away from element at i, j (given j>0)

    i mean from element i, j-1

  • JarvanJarvan Member, Xamarin Team Xamurai

    @EEst
    Set Image's Aspect property to AspectFill. AspectFill - Clips the image so that it fills the display area while preserving the aspect.

    <Image Source="grid_" 
            ... 
            Aspect="AspectFill"/>
    

    Tutorial:
    https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/images?tabs=windows#displaying-images

  • EEstEEst Member ✭✭

    @Jarvan yeah i did that but images didn't conserve proportion, and i want to display them as users upload it. But i guess i could make a CrooImageView so every image would have same proportion then the problem just go away...

    But thank u for ur help really!!!

Sign In or Register to comment.