Code Monkey home page Code Monkey logo

navigator's Introduction

Navigator

by Weezya

version

  • Application Mobile Android réalise avec Android Studio
  • Navigateur d'activités et de fragments en Front-End
  • Projet d'étude 4A à l'ESIEA encadré par M. VINCENT (Dev Mobile chez ENGIE)
  • Approfondissement de bases de programmation mobile vues en 3A

https://github.com/Weezya/Navigator

Table of Contents

Fonctionnalités détaillées

Ce projet a été créé avec l’activité Navigation Drawer générée par Android Studio comprenant un menu avec 6 éléments : Home, Map, About, Pokedex, Gallery et Login. Il y a également deux activités complémentaires : Splash et ItemData

  • 3 Fragments fonctionnant dans l’activité Main

    • Home = Écran d'accueil simple
      • NestedScrollView + CardView + RelativeLayout + ...
    • Map = Service de cartographie en ligne
    • About = Informations sur Navigator
      • Signature de l'application
      • Rappel des fonctionnalités
      • LinearLayout simple et efficace
  • 3 activités attachées au menu

    • Pokedex = Liste des 964 Pokémons
      • Instance de Pokémon et adaptateur pour chaque
      • Call de l'API avec Retrofit et conversion GSON avec accès Internet
      • Call d'une seconde API pour les images avec Glide
      • Gestion de Layout avec une grille de 3 colonnes
      • Chargement par blocs de 20 avec le Scroll
      • RecyclerView + AppBar/Toolbar + ...
    • Gallery = Liste de paysages
      • Hard coded data with Adapter : Name, Place, Description, Image
      • Adaptateur pour chaque élément de la liste
      • Calendrier au-dessus de la liste
      • ListView + CardView + ConstraintLayout + CoordinatorLayout + ...
    • Login = Page d'authentification
      • Généré avec Android Studio
      • Retourne une notification "Welcome back Satoshi" après connexion
      • Page d’enregistrement manquante
      • LinearLayout + EditText + Button + ...
  • 1 activité lancée au démarrage de l'application

    • Splash = Chargement de l'application
      • Animation appliquée au logo et au titre
      • Attente de 5 secondes pour laisser le chargement finir
  • 1 activité lancée via Gallery

    • ItemData = Informations sur un paysage
      • Ouverture du détail lors de la sélection d'un élément dans Gallery
      • Utilisation d'un Intent pour traduire les données de la liste
      • CollapsingToolbarLayout + NestedScrollView + CardView + ...

Design

  • Travail effectué tout au long du projet et à la fin pour les tests d'affichage
  • Le travail sur XML met parfois plus de temps que la programmation du Java
  • Différents éléments personnalisé et cherché sur Internet :
    • colors + size + fonts
    • icones + photos + parallax + buttons
    • gradients + animations
    • layout management

Découverte des shimmer Facebook (Work in Progress)

Catalogue de Navigator

Splash Home
Features Features
Menu Login
Features Features
Gallery Description
Features Features
Map Pokedex
Features Features

Démonstration

Features

Démarche de développement Mobile

  • Début : Navigation Drawer

    • Premier prototype d'application effectué pendant les vacances avec l'activité Navigation Drawer
    • Problèmes rencontrés en reprenant le projet de l'année dernière
    • Beaucoup de mises à jour de code nécessaires pour le refaire fonctionner
  • Pokedex

    • Reprise des éléments de l'ancien projet Pokedex pour appeler l'API et l'afficher dans sa RecyclerView
  • Map

    • Création facile et intuitive de l'activité Maps avec Android Studio
    • Récupération d'une clé API sur le site de Google
  • Gallery

    • Partir à la conquête de sa propre liste écrite en dur
    • Afficher le détail de chaque élément dans une nouvelle activité
  • Home et Login

    • Plusieurs pirouettes et jeux de jambes sur clavier avec divers tutoriels
    • Beaucoup d'idées et de changements pour arriver à un produit final
  • Fin : About

    • Rappels des fonctionnalité et Signature de l'application

Il faut bien comprendre les dépendances et la configuration de son projet avant de se lancer dans le développement de celui-ci car maîtriser son code facilite la correction en cas d'erreurs ou de conflits. Il est important aussi de bien assimiler la différence entre un fragment et une activité avant de se lancer au propre dans un nouveau projet tel que la Navigation Drawer.

Entre les systèmes Windows et Mac, Android Studio ne génère pas la même activité Navigation Drawer : sur Mac on a une structure simple avec une seule activité et un menu à compléter soi-même alors que sur Windows il génère également chaque fragment avec une structure légèrement différente.

Il faut toujours faire un backup avant de faire des folies avec son code : soit tout le projet entre chaque grandes étapes, soit des bouts de codes pour les changements partiels. Sublime Text est un très bon outil pour cela et il possède des codes couleurs pour s'y retrouver et comparer des lignes. Beaucoup de problèmes sont résolus après avoir tourné en rond autour de la solution.

Le projet est toujours en voie de développement.

"Work still in Progress"

Structuration du projet

  • Architecture MVC (Model View Controller)
  • Beaucoup de ressources pour le design
Android
├───App
│   │ 
│   ├───AndroidManifest
│   │   
│   ├───java.com.example.navigator
│   │   │  
│   │   ├───Models
│   │   │       LoggedInUser
│   │   │       LoggedInUserView
│   │   │       LoginFormeState
│   │   │       LoginResult
│   │   │       LoginViewModel
│   │   │       LoginViewModelFactory
│   │   │       Pokemon
│   │   │       PokemonRequest
│   │   │       
│   │   ├───Views
│   │   │       AboutFragment
│   │   │       HomeFragment
│   │   │       ItemdataActivity
│   │   │       ListActivity
│   │   │       LoginActivity
│   │   │       MainActivity
│   │   │       MapsFragment
│   │   │       PokedexActivity
│   │   │       SplashActivity
│   │   │       
│   │   ├───Controller    
│   │   │       LoginDataSource
│   │   │       LoginRepository
│   │   │       PokeAdapter
│   │   │       PokeapiService
│   │   │       Result
│   │   │       
│   │   └─── . . .
│   │   
│   └───res
│       │
│       ├───anim
│       │       transitionstart.xml
│       │       transitionstart2.xml
│       │
│       ├───drawable
│       │       *.jpg . . .
│       │       *.png . . .
│       │       *.xml . . .
│       │       gratient*.xml . . .
│       │       ic_*.xml . . .
│       │       menu_*.xml . . .
│       │       log_*.png . . .
│       │   
│       ├───drawable
│       │       atma_light.ttf
│       │       vibur.ttf
│       │       atma_medium.xml
│       │       atma.xml
│       │       alegreya_sans_sc_thin.xml
│       │       damion.xml
│       │       dosis_light.ttf
│       │       dosis.ttf
│       │       dosis_extralight.xml
│       │       aldrich.xml
│       │       advent_pro.xml
│       │   
│       ├───layout
│       │       activity_list.xml
│       │       activity_login.xml
│       │       activity_main.xml
│       │       activity_pokedex.xml
│       │       activity_splash.xml
│       │       fragment_about.xml
│       │       fragment_home.xml
│       │       fragment_maps.xml
│       │       home_features_grid.xml
│       │       list_item_data.xml
│       │       list_item_row.xml
│       │       main_nav_header.xml
│       │       pokedex_item.xml
│       │   
│       ├───menu
│       │       activity_main_drawer.xml
│       │       main.xml
│       │       
│       ├───mipmap
│       │       ic_*.png . . .
│       │       ic_*.xml . . .
│       │       log_*.png . . .
│       │   
│       └───values
│               colors.xml
│               dimens.xml
│               drawables.xml
│               font_certs.xml
│               google_maps_api.xml
│               ic_navigator_background.xml
│               preloaded_fonts.xml
│               strings.xml
│               styles.xml
│
└───Gradle

navigator's People

Stargazers

 avatar  avatar  avatar  avatar

Watchers

 avatar  avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.