Tools & tips of the trade for the Android Developer

Slides of the keynote given at the Spanish GDG summit on September 2015

Transcript

1. Tools & tips of the trade
   for the Android Developer
   Saúl Molinero
   Spanish GDGs Summit 2015
   

   View Slide

2. Android UI
   

   View Slide

3. Material Design
   

   View Slide

4. Material design Spec
   https://www.google.com/design/spec/material-design/introduction.html
   

   View Slide

5. Android Niceties
   http://androidniceties.tumblr.com
   

   View Slide

6. materialup
   http://www.materialup.com
   

   View Slide

7. https://dribbble.com/
   

   View Slide

8. + =
   https://github.com/saulmm/OpenLibra-Material
   

   View Slide

9. TabLayout
   FloatingActionButton
   CollapsingActionBarLayout
   NavigationView
          compile  ‘com.android.support:design:23.x.x’  
   

   View Slide

10. TabLayout
    FloatingActionButton
    CollapsingActionBarLayout
    NavigationView
    https://github.com/chrisbanes/cheesesquare
    

    View Slide

11. View Slide

12. CoordinatorLayout
    

    View Slide

13.  
    android:id=“@+id/io.appbar”/>  
    

     
     
     
           
    

           app:layout_anchor=“@id/io.appbar”  
         app:anchor_gravity=“bottom”  >  
               
         
     
     
    Coordinator Layout: Anchor attributes
    

    View Slide

14. View Slide

15.  
     
     android:behavior_overlapTop=“78dp”>  
           
     
     
    CoordinatorLayout: Flexible Space
    https://github.com/saulmm/CoordinatorExamples
    

    View Slide

16. https://github.com/saulmm/CoordinatorBehaviorExample
    Coordinator Layout: Behaviors
    

    View Slide

17. Child
    

    View Slide

18. Coordinator Layout Behaviors
    Dependency
    

    View Slide

19. 

    public static class AvatarImageBehavior extends 

    CoordinatorLayout.Behavior {
    @Override
    public boolean layoutDependsOn(

    CoordinatorLayout parent, CircleImageView, child, View dependency) {
    return dependency instanceof Toolbar;
    }

    

    public boolean onDependentViewChanged(

    CoordinatorLayout parent, CircleImageView avatar, View dependency) {

    modifyAvatarDependingDependencyState(avatar, dependency);
    }
    }
    

    View Slide

20. 

    public static class AvatarImageBehavior extends 

    CoordinatorLayout.Behavior {
    @Override
    public boolean layoutDependsOn(

    CoordinatorLayout parent, CircleImageView, child, View dependency) {
    return dependency instanceof Toolbar;
    } 

    

    public boolean onDependentViewChanged(

    CoordinatorLayout parent, CircleImageView avatar, View dependency) {

    modifyAvatarDependingDependencyState(avatar, dependency);
    }
    }
    

    View Slide

21. 

    public static class AvatarImageBehavior extends 

    CoordinatorLayout.Behavior {
    @Override
    public boolean layoutDependsOn(

    CoordinatorLayout parent, CircleImageView, child, View dependency) {
    return dependency instanceof Toolbar;
    } 

    

    public boolean onDependentViewChanged(

    CoordinatorLayout parent, CircleImageView avatar, View dependency) {

    modifyAvatarDependingDependencyState(avatar, dependency);
    }
    }
    

    View Slide

22. 

    public static class AvatarImageBehavior extends 

    CoordinatorLayout.Behavior {
    @Override
    public boolean layoutDependsOn(

    CoordinatorLayout parent, CircleImageView, child, View dependency) {
    return dependency instanceof Toolbar;
    } 

    

    public boolean onDependentViewChanged(

    CoordinatorLayout parent, CircleImageView avatar, View dependency) {

    modifyAvatarDependingDependencyState(avatar, dependency);
    }
    }
    

    View Slide

23. 

    public static class AvatarImageBehavior extends 

    CoordinatorLayout.Behavior {
    @Override
    public boolean layoutDependsOn(

    CoordinatorLayout parent, CircleImageView, child, View dependency) {
    return dependency instanceof Toolbar;
    }

    

    public boolean onDependentViewChanged(

    CoordinatorLayout parent, CircleImageView avatar, View dependency) {

    modifyAvatarDependingDependencyState(avatar, dependency);
    }
    }
    

    View Slide

24. Multiple Parallax Effects
    https://github.com/saulmm/CoordinatorBehaviorExample
    

    public  void  initParallaxValues  {

         CollapsingToolbarLayout.LayoutParams  lp1  =

                 (CollapsingToolbarLayout.LayoutParams)  

                           mPetImage.getLayoutParams();

    

         CollapsingToolbarLayout.LayoutParams  lp2  =

                 (CollapsingToolbarLayout.LayoutParams)  

                           mPetTextContainer.getLayoutParams();

    

         lp1.setParallaxMultiplier(0.9f);  
         lp2.setPArallaxMultiplier(0.3f);

    

         mPetImage.setLayoutParams(lp1);

         mPetTextContainer.setLayoutParams(lp2);

    }
    

    View Slide

25. Android Resources
    

    View Slide

26. View Slide

27.      android:layout_width=“@dimen/spacing_left”  
         android:layout_height=“wrap_content”

         />
         android:layout_width=“wrap_content”  
         android:layout_height=“wrap_content”

         style=“@style/myTitleText”

         />
         android:layout_width=“wrap_content”  
         android:layout_height=“wrap_content”

         style=“@style/mSubTitleText

         />
    56dp
    

    View Slide

28.      android:layout_width=“wrap_content”  
         android:layout_height=“wrap_content”

         style=“@style/Widget.Appcompat.Toolbar.Button.Navigation

         />
         android:layout_width=“wrap_content”  
         android:layout_height=“wrap_content”

         style=“@style/TextAppearance.Appcompat.Widget.ActionBar.Title”

         />
         android:layout_width=“wrap_content”  
         android:layout_height=“wrap_content”

         style=“@style/TextAppearance.Appcompat.Widget.ActionBar.Subtitle”

         />
    Reuse available styles
    

    View Slide

29. Built-in decompiler
    

    View Slide

30.  
    2dp

    4dp

    8dp

    16dp

    32dp
     
    No  results  
    You  need  to  be  logged  
    Network  error  
    Couldn’t  fetch  films  
    Couldn’t  fetch  %s  data
    Organise your resources, DRY
    https://github.com/futurice/android-best-practices
     
    12sp

    14sp

    16sp

    18sp

    

    

     
    2dp

    4dp

    8dp

    12dp

    16dp
    

    View Slide

31.  
     <br/>      <item  name=“android:textColor”>?colorAccent</item>  <br/>      <item  name=“android:fontFamily”>sans-­‐serif-­‐medium</item>  <br/>      <item  name=“android:textAllCaps”>true</item>  <br/>  
     <br/>      <item  name=“android:textColor”>@color/gray_dark</item>  <br/>  
     <br/>      <item  name=“android:minHeight”>@dimen/grid_size_medium</item>  <br/>      <item  name=“android:gravity”>center_vertical</item>  <br/>  
     <br/>    <item  name=“android:textAppearance”>@style/TextAppearance.Header</item>  <br/>  
     <br/>    <item  name=“android:textAppearance”>@style/TextAppearance.Field</item>  <br/>  
     <br/>      <item  name=“android:clickable”>true</item>  <br/>      <item  name=“android:background”>?android:attr/selectableItemBackground</item>  <br/>  
    

    View Slide

32. Vector graphics generator
    

    View Slide

33. Architecture
    

    View Slide

34. Entities
    Use cases
    Controllers
    UI
    Clean architecture
    

    View Slide

35. View Slide

36. public  interface  MoviewView  {

         public  void  showMovieTitle  (String  title);

    

         public  void  showMovieImage  (String  imageUri);

       
         public  void  showTagLine  (String  tagLine);

    

         public  void  showDescription  (String  descrpition);

    

         public  void  showWebPage  (String  webPage);  
    

         public  void  showProducer  (String  producer);  

    

         public  void  showLoadingIndicator  ();

    

         public  void  hideLoadingIndicator  ();

    }
    

    View Slide

37. public  class  MovieActivity  implements  MovieView  {

         private  MoviePresenter  mPresenter;

    

         public  void  onCreate  ()  {  …  mPresenter.onCreate();  }  

    

         public  void  onResume  ()  {  …  mPresenter.onResume();  }

    

         public  void  showMovieTitle  (String  title)  {

               mTitleTextView.setText(title);

         }

    

         public  void  showMovieImage  (String  imageUri)  {

               Glide.with(this).load(imageUri).into(mFilmImageView);

         }

    

           public  void  showLoadingIndicator  ()  {

               mLoadingIndicator.setVisibility(View.VISIBLE);

         }

    

         public  void  hideLoadingIndicator  ()  {

               mLoadingIndicator.setVisibility(View.GONE);

         }

    }
    

    View Slide

38. public  interface  MoviePresenter  {

         private  MovieView  mMoviewView;

         private  MovieUsecase  mMovieUsecase;

    

         public  void  MoviePresenter  (MovieView  movieView)  {

               mMovieView  =  movieView;

         }

    

         public  void  onCreate  ()  {  
               mMoviewView.showLoadingMoview();  
               mMovieUsecase.subscribe(movie::bindMovie)  
         }  

           
         public  void  bindMovie  (Movie  movie)  {

               mMovieView.hideLoadingIndicator();

               mMovieView.showMovieTitle(movie.getTitle());

               mMovieView.showMovieImage(movie.getImage());

         }

    }
    

    View Slide

39. public  class  MovieUsecase  implements  Usecase  {

         private  Repository  mRepository;    
         public  Observable  execute  {

               return  mRepository.getRandomMovie();

         }

    }
    

    View Slide

40. //  settings.gradle  
    include:  ‘:presentation’,  
                     ‘:domain’,

                     ‘:model’,  
                     ‘:common’
    //  your  module  build.gradle  
    compile  project:  ‘(:{your  module})’    
    Layers as modules
    

    View Slide

41. Libraries & resources
    

    View Slide

42. ButterKnife
    http://jakewharton.github.io/butterknife/
    

    View Slide

43. Stetho
    https://github.com/facebook/stetho
    

    View Slide

44. RetroLambda
    https://github.com/orfjackal/
    RxAndroid
    https://github.com/ReactiveX/RxAndroid
    RxJava
    https://github.com/ReactiveX/RxJava
    Be reactive!
    

    View Slide

45. To-do list
    

    View Slide

46. https://code.facebook.com/posts/android/
    http://panavtec.me/
    https://github.com/lgvalle/Material-Animations
    http://www.technotalkative.com/part-4-playing-with-navigationview/
    https://medium.com/ribot-labs/exploring-the-new-android-design-support-library-b7cda56d2c32
    http://androcode.es/
    http://google.github.io/dagger/
    http://blog.sqisland.com/
    https://medium.com/ribot-labs/exploring-the-new-android-design-support-library-b7cda56d2c32
    https://github.com/JakeWharton
    

    View Slide

47. https://blog.stylingandroid.com/
    http://androidweekly.net/
    http://antonioleiva.com
    https://developers.google.com/experts/all/technology/android
    https://github.com/trending?l=java
    http://fernandocejas.com/
    http://gradleplease.appspot.com/
    https://github.com/futurice/android-best-practices
    https://github.com/googlesamples?utf8=%E2%9C%93&query=android
    

    View Slide

48. Thanks !
    https://github.com/saulmm
    https://twitter.com/_saulmm
    http://saulmm.github.io/
    

    View Slide