Change contentpage's content depending platform (in XAML)

LouisBeaumontLouisBeaumont Member ✭✭
edited June 2018 in Xamarin.Forms

I have to use something else than ListView for iOS version of my application because ListView is ugly, bugged on iOS (IsVisible doesn't work) and too different from Android.
So i was looking for something like OnPlatform in XAML to choose ListView for Android and something else like a ScrollView for iOS, i couldn't find any documentation for something else than Padding or styles things with OnPlatform for example
Something like that ?

<OnPlatForm>
    <OnPlatform.Platforms>
        <On Platform="Android">
            <ContentPage.Content>
                <ListView  ItemsSource="{Binding xxx}" 
                        HasUnevenRows="True">
                    ...
                </ListView>
            </ContentPage.Content>
        </On>
    </OnPlatform.Platforms>
</OnPlatForm>

<OnPlatForm>
    <OnPlatform.Platforms>
        <On Platform="iOS">
            <ContentPage.Content>
                    <ScrollView >
                    ...
                </ScrollView >
            </ContentPage.Content>
        </On>
    </OnPlatform.Platforms>
</OnPlatForm>

Thanks for help !

Tagged:

Posts

  • ClintStLaurentClintStLaurent USUniversity ✭✭✭✭✭

    So what is it you're asking... I can't figure it out from the question.
    Are you looking for something other than ListVIew... Or properties other than padding... You know ScrollView doesn't support binding to a collection, right? So how do you plan on using it?

  • LouisBeaumontLouisBeaumont Member ✭✭

    I just need to use ListView for Android and ScrollView for iOS, simple, I know ScrollView doesn't support binding to a collection, doesn't matter

  • NMackayNMackay GBInsider, University mod

    You can use OnPlatform and contentviews to achieve this.

  • LouisBeaumontLouisBeaumont Member ✭✭

    @NMackay said:
    @LouisBeaumont

    Here's a sample.

    <ContentPage.Content>
            <ContentView>
                <ContentView.Content>
                    <OnPlatform x:TypeArguments="View">
                        <On Platform="Android">
                            <StackLayout Orientation="Vertical">
                                <Button Text="iOS"></Button>
                                <ListView />
                            </StackLayout>
                        </On>
                        <On Platform="iOS">
                            <ScrollView>
                                <Button Text="iOS"></Button>
                            </ScrollView>
                        </On>
                        <On Platform="UWP">
                            <Grid>
                                <Button Text="UWP"></Button>
                            </Grid>
                        </On>
                    </OnPlatform>
                </ContentView.Content>
            </ContentView>
        </ContentPage.Content>
    

    Omg thanks !!!
    This is exactly what i was looking for, I couldn't find such an example, you saved me !

  • ClintStLaurentClintStLaurent USUniversity ✭✭✭✭✭

    So here's my question.
    If on Android you had <ListView ItemsSource="{Binding xxx}"
    What are you going to bind with on iOS ? What control are you going to us in place of ListView that will let you bind to a collection and still have automatic updates to your UI when elements in your collection change?

  • LouisBeaumontLouisBeaumont Member ✭✭

    @ClintStLaurent said:
    So here's my question.
    If on Android you had <ListView ItemsSource="{Binding xxx}"
    What are you going to bind with on iOS ? What control are you going to us in place of ListView that will let you bind to a collection and still have automatic updates to your UI when elements in your collection change?

    My collection is fixed size, it won't lose an item or add one.
    I'll just do "dirty code" for iOS because i don't have the choice / time
    => copy paste stack layout for each item in my collection :D

  • ClintStLaurentClintStLaurent USUniversity ✭✭✭✭✭

    Observation is more than size. If a status change on one of the objects... An employ goes from clocked-in to clocked-out... that's something that should update the UI through binding. If someone changes the category of a movie in your collection, the number stays the same but a movie goes from 'Comedy' to 'Drama', that is a change that should be updated in the UI automatically. Etc.

  • LouisBeaumontLouisBeaumont Member ✭✭

    @ClintStLaurent said:
    Observation is more than size. If a status change on one of the objects... An employ goes from clocked-in to clocked-out... that's something that should update the UI through binding. If someone changes the category of a movie in your collection, the number stays the same but a movie goes from 'Comedy' to 'Drama', that is a change that should be updated in the UI automatically. Etc.

    Of course my UI use binding
    For example =>

    <Label Text="{Binding xxx[0].a}" Margin="0,0,40,0" VerticalOptions="CenterAndExpand" HorizontalOptions="EndAndExpand"/>
    

    Obviously i don't have to use "xxx[0]" in the case of Android which use ListView

Sign In or Register to comment.