GPlates / gplates-app

GPlates Mobile App
https://www.gplates.org
2 stars 0 forks source link

show tutorial with onboarding screen #59

Closed michaelchin closed 2 years ago

michaelchin commented 2 years ago

https://www.reddit.com/r/ionic/comments/l0d4on/ionic_5_onboarding_screen_ui_speed_code/

yiyanw commented 2 years ago

@michaelchin I checked this video tutorial and their source code, I found that this is not official component and it is based on angularJS. So we need to rewrite it if we want this functionality. Here is the source code link: https://github.com/gihan667/ionic-onboarding-screen

michaelchin commented 2 years ago

@michaelchin I checked this video tutorial and their source code, I found that this is not official component and it is based on angularJS. So we need to rewrite it if we want this functionality. Here is the source code link: https://github.com/gihan667/ionic-onboarding-screen

It should not be too difficult. See the ionic slides doc below. We can show the slides at startup and use a flag to control if user wants to see it again next time. The flag can be saved in Preference (https://github.com/GPlates/gplates-app/blob/73178df7c9d90c81652b36d9780ef8fe36a882eb/src/functions/settings.ts#L9).

https://ionicframework.com/docs/api/slides

Be aware that the ionic team has deprecated the ion-slides and ion-slide components in favor of using the official framework integrations provided by Swiper. So, you need to figure out how to use/migrate to Swiper. It seems to me not different either.

Matthew has used Swiper in his component. See here https://github.com/GPlates/gplates-app/blob/73178df7c9d90c81652b36d9780ef8fe36a882eb/src/components/CustomToolbar.tsx#L97-L107

matthew-merkas commented 2 years ago

@michaelchin Did you have any specific content in mind for the tutorial, or should I just create something myself?

michaelchin commented 2 years ago

@michaelchin Did you have any specific content in mind for the tutorial, or should I just create something myself?

We can use some placeholders for now. Eventually Maria will give us some material to fill in.

michaelchin commented 2 years ago

@matthewmerkas this looks very nice! thank you ! well done!