To add Litho to your project you'll need to configure it with correct settings and dependencies.

We publish Litho artifacts to Bintray's JCenter and first you need to make sure you have the JCenter repository in your root build.gradle file:

build.gradle

repositories {  jcenter()}

Add Litho core dependencies

Java

dependencies {
  // Litho
  implementation 'com.facebook.litho:litho-core:0.40.0'
  implementation 'com.facebook.litho:litho-widget:0.40.0'
  annotationProcessor 'com.facebook.litho:litho-processor:0.40.0'
  
  // SoLoader
  implementation 'com.facebook.soloader:soloader:0.9.0'
  
  // Testing Litho
  testImplementation 'com.facebook.litho:litho-testing:0.40.0'
}

Kotlin

caution

Kotlin support for Litho is experimental at this point.

dependencies {
  // Litho
  implementation 'com.facebook.litho:litho-core:0.40.0'
  implementation 'com.facebook.litho:litho-widget:0.40.0'
  kapt 'com.facebook.litho:litho-processor:0.40.0'
  
  // SoLoader
  implementation 'com.facebook.soloader:soloader:0.9.0'
  
  // Testing Litho
  testImplementation 'com.facebook.litho:litho-testing:0.40.0'
}

Don't forget that in order to use dependencies with annotation processors, you need to apply Kotlin KAPT plugin at the top of your application's build.gradle file:

apply plugin: 'kotlin-kapt'

Add Sections dependencies

Litho comes with an optional library called Sections for declaratively building lists. You can include Sections by adding the following additional dependencies to your build.gradle file:

Java

dependencies {
  // Sections
  implementation 'com.facebook.litho:litho-sections-core:0.40.0'
  implementation 'com.facebook.litho:litho-sections-widget:0.40.0'
  compileOnly 'com.facebook.litho:litho-sections-annotations:0.40.0'
  
  annotationProcessor 'com.facebook.litho:litho-sections-processor:0.40.0'
}

Kotlin

dependencies {
  // Sections
  implementation 'com.facebook.litho:litho-sections-core:0.40.0'
  implementation 'com.facebook.litho:litho-sections-widget:0.40.0'
  compileOnly 'com.facebook.litho:litho-sections-annotations:0.40.0'
  
  kapt 'com.facebook.litho:litho-sections-processor:0.40.0'
}

Wire up native libs

As a last step, you need to initialize SoLoader. Litho has a dependency on SoLoader to help load native libraries provided by the underlying layout engine, Yoga. Your custom Application class is a good place to do this:

Java

MyApplication.java

public class MyApplication extends Application {
  @Override  public void onCreate() {    super.onCreate();    SoLoader.init(this, false);  }}

Kotlin

MyApplication.kt

class MyApplication: Application() {
  override fun onCreate() {    super.onCreate()    SoLoader.init(this, false)  }}

Testing your setup

Now you can test this config by adding a simple UI created with Litho - a built-in Text widget that displays "Hello World!" text - to an activity.

note

Don't worry about all the unfamiliar classes and red Text – we will explain everything in the next step of this tutorial.

Java

MyActivity.java

import com.facebook.litho.ComponentContext;import com.facebook.litho.LithoView;import com.facebook.litho.widget.Text;
public class MyActivity extends AppCompatActivity {
  @Override  public void onCreate(Bundle savedInstanceState) {    super.onCreate(savedInstanceState);
    final ComponentContext c = new ComponentContext(this);
    final LithoView lithoView = LithoView.create(          this /* context */,          Text.create(c)            .text("Hello, World!")            .textSizeDip(50f)            .build());
    setContentView(lithoView);  }}

Kotlin

MyActivity.kt

import com.facebook.litho.ComponentContextimport com.facebook.litho.LithoViewimport com.facebook.litho.widget.Text
class MyActivity : AppCompatActivity() {
  override fun onCreate(savedInstanceState: Bundle?) {    super.onCreate(savedInstanceState)
    val c = ComponentContext(this)
    val lithoView = LithoView.create(        this /* context */,        Text.create(c)            .text("Hello, World!")            .textSizeDip(50f)            .build())
    setContentView(lithoView)  }}

That's it, if you build and run the app you should see "Hello World!" displayed on the screen. Setup is complete, let's go to the next page to understand what we've just done.