Android UX Views

Last Edit: Mar 03 2020

Logging, custom fonts and navigation can be configured at the client level.

Logging

By default logging is disabled. You can enable logs and set the log level when initializing StreamChat:


// setup the logger
StreamChatLogger logger = new StreamChatLogger.Builder()
                .loggingLevel(BuildConfig.DEBUG ? StreamLoggerLevel.ALL : StreamLoggerLevel.NOTHING)
                .build();
// create a configuration object
StreamChat.Config configuration = new StreamChat.Config(this, "api-key");
configuration.setLogger(logger);
// init StreamChat using the configuration
StreamChat.init(configuration);
                    

// setup the logger
val logger = StreamChatLogger.Builder()
    .loggingLevel(if (BuildConfig.DEBUG) StreamLoggerLevel.ALL else StreamLoggerLevel.NOTHING)
    .build()
// create a configuration object
val configuration = StreamChat.Config(this, "api-key")
configuration.setLogger(logger)
// init StreamChat using the configuration
StreamChat.init(configuration)
                    

If you need to intercept logs you can pass a logger handler:


StreamChatLogger logger = new StreamChatLogger.Builder()
                .setLoggingHandler(loggerHandler)
                .build();
                    

val logger = StreamChatLogger.Builder()
    .setLoggingHandler(loggerHandler)
    .build()
                    

Custom fonts

You can set custom fonts for the entire library or for specific UI components. First of all you must put your own font file(s) (.ttf, .otf,…) in your assets or res folder.

Setup for whole library

You can register your custom fonts by StreamChat.initStyle(StreamChatStyle)


StreamChat.initStyle(
  new StreamChatStyle.Builder()
    .setDefaultFont(R.font.your_custom_font)
    //.setDefaultFont("fonts/your_custom_font.ttf")    
    .build()
                    

StreamChat.initStyle(
    StreamChatStyle.Builder()
        .setDefaultFont(R.font.your_custom_font)
        // or .setDefaultFont("fonts/your_custom_font.ttf")
        .build()
                    

Setup for specific UI components

Alternatively you can set custom fonts for specific UI components. Have a look at the font attributes for the custom view you're customizing.

The UI SDK has few builtin activities, webview and system browser Intents. Navigation between these components is handled internally by the StreamChatNavigator class. The concept is similar to the Google Navigation component:

  • ChatDestination represents a destination like the camera app or system web browser.

  • The SDK enables you to intercept destinations and handle them in a custom way.

  • Destination object provide the required information for navigation. For instance the WebLinkDestination has a url field which will be passed to system web browser.

The example below shows how you can open a custom webview when a user clicks on a link. It does this by overriding the behavior for  WebLinkDestination and AttachmentDestination:


StreamChat.Config config = new StreamChat.Config(this, "apiKey");

config.navigationHandler(destination -> {

    String url = "";
    boolean handled = false;

    if (destination instanceof WebLinkDestination) {
        url = ((WebLinkDestination) destination).url;
    } else if (destination instanceof AttachmentDestination) {
        url = ((AttachmentDestination) destination).url;
    }

    if (url.startsWith("https://your.domain.com")) {
        // handle/change/update url
        // open your webview, system browser or your own activity
        // and return true to override default behaviour
        handled = true;
    }

    return handled;
});
StreamChat.init(config);
                    

val config = StreamChat.Config(this, "apiKey")

config.navigationHandler {
    var url = ""
    var handled = false
    if (it is WebLinkDestination) {
        url = it.url
    } else if (it is AttachmentDestination) {
        url = it.url
    }
    if (url.startsWith("https://your.domain.com")) { // handle/change/update url
        // open your webview, system browser or your own activity
        // and return true to override default behaviour
        handled = true
    }
    handled
}
StreamChat.init(config)
                    

Another example is opening a custom camera interface:


config.navigationHandler(destination -> {
    if (destination instanceof CameraDestination) {
        //open custom camera activity
        return true;
    } else {
        return false;
    }
});
                    

config.navigationHandler {
    if (it is CameraDestination) {
        //open custom camera activity
        return true
    } else {
        return false
    }
}
                    

The following 4 destinations are exposed by the Navigation Handler:

  • AppSettingsDestination opens app setting when required permissions are not granted

  • AttachmentDestination opens attachment activity when user click on attachment

  • CameraDestination opens camera when user makes photo or video to send it in channel

  • WebLinkDestination opens system web browser when user clicks on link