Skip to content

Conversation

@emccarroll
Copy link

@emccarroll emccarroll commented Sep 25, 2019

Submission description

I have wanted to create a mobile UI for a temperature monitoring project of mine for a while now and I thought a Carousel View would be perfect. I was also inspired by kphillpotts's use of SkiaSharp and figured I'd try that out as well. *Note no monkeys were harmed making this app

challenge2

20190924_230504

What went well

I was able to easily add in the carousel view and populate it through data bindings.

What didn't go well

Initially I found it difficult to use PeekAreaInsets and the Carousel Item's padding in order to get the distance between objects how I wanted. Perhaps having a Carousel Item spacing property on the Carousel View would make it easier to implement?

I wasn't able to keep the size of my Carousel Items consistent across phones with different screen widths. This is probably because I put everything into Grids with Non Explicit Height/Width Constraints(I only used * , 4* , 2* etc).

I had issues merging my commits because my clone was behind the main branch due to cloning early on.

Missing or desired things

Carousel Item Spacing Property(Explanation Above)

Anything else

I love <3 swag!

@emccarroll emccarroll changed the title Commiting additions for CarouselViewChallenge InstaTemp: A temperature monitoring app! Sep 25, 2019
@davidortinau
Copy link
Contributor

To set the spacing between objects use ItemSpacing:

<CarouselView PeekAreaInsets="30"
                      Position="2"
                      ItemTemplate="{DataTemplate views:CityBoxTemplate}"
                      ItemsSource="{Binding Cities}"
                      Grid.Row="1">
            <CarouselView.ItemsLayout>
                <LinearItemsLayout Orientation="Horizontal" 
                                   SnapPointsType="MandatorySingle"
                                   SnapPointsAlignment="Center"
                                   ItemSpacing="8"/>
            </CarouselView.ItemsLayout>            
        </CarouselView>

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants