Big Nerd Ranch

We are using static items for hero list. What do we do if I want to load data from a service. We are going to use same data but we will use data loader instead of hard coded data. Let's initialise hero data first. We need to provide @OnCreateInitialState annotate function to do this in HeroesComponentSpec. @GroupSectionSpec object HeroesComponentSpec { @OnCreateInitialState fun onCreateInitialSt..

We're going to display list of hero name, image and description on the screen. You can think I am gonna build RecyclerView using Litho. Let's define data class for hero first. data class Hero( val name: String, val description: String, @DrawableRes val image: Int)It's straightforward and let's prepare hero data. package com.mpark.android.marblecharacters class DataLoader { compan..

GroupSection Spec's Lifecylce looks like following: GroupSection Spect has lifecycle in order below: @OnCreateInitialState To set an initial value for a state, you have to write a method annotated with @OnCreateInitialState in your spec. The first parameter must be of type ComponentContext. StateValue and @Prop are allowed. For example, @LayoutSpec object CheckboxSpec { @OnCreateInitialState fun..

Let's implement CharactersComponentSpec to display text list. @OnCreateChildren internal fun onCreateChildren(c: SectionContext): Children { val builder: Children.Builder = Children.create() (1..10).forEach { builder.child( SingleComponentSection.create(c) .key(it.toString()) .component( Text.create(c) .text("Item$it") .textSizeSp(20f) .heightDip(48f) .build() ) .build() ) } return builder.build..

Litho is quite well optimised for list data and can have better performance when you display many data and complex layout on the screen. Of course, you can do simple screen like Hello word but Litho is more powerful when we use it for large dataset and complex UI. Big win of Litho is that it measure size and calculate positions and ready to draw in a background and job in UI thread becomes much ..

Setup My code is fully based on Kotlin. Latest version of Litho I am writing is 0.31.0 . Add the following dependencies to your app module build.gradle. //litho implementation 'com.facebook.litho:litho-core:0.31.0' implementation 'com.facebook.litho:litho-widget:0.31.0' compileOnly 'com.facebook.litho:litho-annotations:0.31.0' kapt 'com.facebook.litho:litho-processor:..

Kotln, Modern Programming Lauage Kotln, Modern Programming Lauage Kotlin이 뭐죠? Kotlin 은 자바의 가상머신 (JVM) 위에서 돌아가는 프로그래밍 언어입니다. Jetbrain이라는 IntelliJ, Android Studio와 같은 IDE를 만드는 회사에서 자바가 하기 힘든 기능들을 지원하기 위해서 만들어진 언어입니다. Jetbrain 또한 기존의 시스템이 자바에 많이 의존하고 있었고 자바의 한계, NullPointer라던가 변수 등을 조작함으로써 데이터를 관리하는 Mutability 등을 극복하기 위해 만들어졌습니다. 실제로 자바의 언어적 한계로 인해 생산성도 떨어지게 되고 예기치않은 에러도 발생하기 쉬웠기 때문에 Jetbrain은 새로운 ..

DataBinding Library 이용하면 안드로이에서 구현이 쉽지 않고 쓸때없이 많은 클래스를 생성했던 단점을 극복하면서 MVP나 MVVM 같은 패턴을 구현할 수 있다. View는 화면에 Model이 가진 데이터를 보여주는 역할을 한다. 이 부분은 DataBinding Library가 데이터바인딩을 통해 자동으로 처리해 준다.Model 데이터의 값과 상태를 보관한다. View가 뭔지에 대해서는 전혀 신경쓰지 않기 때문에 뷰를 조작하는 코드는 사용하지 않는다.ViewModel은 View와 Model 사이에서 두 레이어를 중계해 준다. 사용자의 interaction을 받아서 데이터를 변경해주는 역할을 한다. 비지니스 로직은 ViewModel 레이어에 위치한다고 볼 수 있다. 이런 Design Patter..

ButterKnife vs Data Binding 뷰바인딩을 위해 ButterKnife를 써오셨던 분들이 많을 것이다. 리플렉션을 사용하지 않아서 퍼포먼스에 영향을 주지 않고 어노테이션 반으로 많은 보일러 플레이트 코드를 작성하지 않아도 도와주었던 안드로이드 개발자들의 친구였다. 하지만 이제 그 자리를 Data Binding Library에게 내주어줄 때가 된 것 같다. 왜냐하면 Data Binding Library하나로 ButterKnife의 핵심 기능이었던 뷰바인딩은 기본이고 모델을 뷰에 바인딩 해줌으로써 훨씬 더 진보된 바인딩을 할 수 있기 때문이다. 그리고 어노테이션을 작성해 줄 필요도 없고 한번에 레이아웃을 바인딩 객체 안에 읽어 들임으로써, 모든 뷰에 접근을 할 수 있다. 그렇다고 퍼포먼스에 ..