I’m creating an

horizontalChain

in a

constraintLayout

for the first time using the dsl, and it’s not easy nor easy to read

Hello, I'm trying to get Splitties Ui Preview to work, but even after a full build, I get an issue in my preview:

Failed to instantiate one or more classes
The following classes could not be instantiated:
- splitties.views.dsl.idepreview.UiPreView (Open Class, Show Exception, Clear Cache)

Here's my preview file `src/debug/res/layout/main_preview.xml`:

<splitties.views.dsl.idepreview.UiPreView
    xmlns:android="<http://schemas.android.com/apk/res/android>"
    xmlns:app="<http://schemas.android.com/apk/res-auto>"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:splitties_class_package_name_relative=".MainUi"/>

The actual Ui file:

class MainUi(override val ctx: Context) : Ui {
    override val root = coordinatorLayout {
        fitsSystemWindows = true
        add(appBarLayout(theme = R.style.AppTheme_AppBarOverlay) {
            add(toolbar {
                popupTheme = R.style.AppTheme_PopupOverlay
                (ctx as? AppCompatActivity)?.setSupportActionBar(this)
            }, defaultLParams())
        }, appBarLParams())
        add(frameLayout(id = R.id.container) {}, contentScrollingWithAppBarLParams())
    }
}

In my dependencies, I have

debugImplementation("com.louiscad.splitties:splitties-views-dsl-ide-preview:$splittiesVersion")

Is there something I might have missed?

Hello! I'm trying to use Splitties in a hybrid java/kotlin project. I have standard build.gradle file in groovy. Is possibile to use dsl preview adding it?

Do you have some plans about view DSL binding?

I've not yet figured out how to get publishing to work (other than through mavenLocal), so if you want to try, I recommend to wait a little unless you want to clone it and dig a bit

@louiscad is there any reason why Snackbar extensions are only defined on CoordinatorLayout? From what I understand you can use a Snackbar without a CoordinatorLayout, but not with Splitties 😕

@louiscad just to be sure I didn’t miss something obvious, there’s no extension for

SwipeRefreshLayout

in Splitties right?

@louiscad I’m using the Intents split, but I don’t see anything about

startActivityForResult

, is there no extension that cover this use case anywhere?

Hello! @louiscad, do you think that migrating from anko to splitties is possible without a complete rewrite? I mainly use the layout DSL:

verticalLayout, scrollView, textView, button

etc

Here is a stacktrace

java.lang.ClassNotFoundException: com.louiscad.splittiessample.main.MainUi
	at org.jetbrains.android.uipreview.ModuleClassLoader.load(ModuleClassLoader.java:201)
	at com.android.tools.idea.rendering.RenderClassLoader.findClass(RenderClassLoader.java:61)
	at org.jetbrains.android.uipreview.ModuleClassLoader.findClass(ModuleClassLoader.java:135)
	at java.lang.ClassLoader.loadClass(ClassLoader.java:424)
	at java.lang.ClassLoader.loadClass(ClassLoader.java:357)
	at org.jetbrains.android.uipreview.ModuleClassLoader.loadClass(ModuleClassLoader.java:235)
	at java.lang.Class.forName0(Native Method)
	at java.lang.Class.forName(Class.java:264)
	at splitties.views.dsl.idepreview.UiPreView.<init>(UiPreView.kt:60)
	at splitties.views.dsl.idepreview.UiPreView.<init>(UiPreView.kt:43)
	at splitties.views.dsl.idepreview.UiPreView.<init>(UiPreView.kt)
	at sun.reflect.NativeConstructorAccessorImpl.newInstance0(Native Method)
	at sun.reflect.NativeConstructorAccessorImpl.newInstance(NativeConstructorAccessorImpl.java:62)
	at sun.reflect.DelegatingConstructorAccessorImpl.newInstance(DelegatingConstructorAccessorImpl.java:45)
	at java.lang.reflect.Constructor.newInstance(Constructor.java:423)
	at org.jetbrains.android.uipreview.ViewLoader.createNewInstance(ViewLoader.java:403)
	at org.jetbrains.android.uipreview.ViewLoader.loadClass(ViewLoader.java:186)
	at org.jetbrains.android.uipreview.ViewLoader.loadView(ViewLoader.java:144)
	at com.android.tools.idea.rendering.LayoutlibCallbackImpl.loadView(LayoutlibCallbackImpl.java:309)
	at android.view.BridgeInflater.loadCustomView(BridgeInflater.java:418)
	at android.view.BridgeInflater.loadCustomView(BridgeInflater.java:429)
	at android.view.BridgeInflater.createViewFromTag(BridgeInflater.java:333)
	at android.view.LayoutInflater.createViewFromTag(LayoutInflater.java:730)
	at android.view.LayoutInflater.inflate(LayoutInflater.java:492)
	at android.view.LayoutInflater.inflate(LayoutInflater.java:394)
	at com.android.layoutlib.bridge.impl.RenderSessionImpl.inflate(RenderSessionImpl.java:323)
	at com.android.layoutlib.bridge.Bridge.createSession(Bridge.java:394)
	at com.android.tools.idea.layoutlib.LayoutLibrary.createSession(LayoutLibrary.java:200)
	at com.android.tools.idea.rendering.RenderTask.createRenderSession(RenderTask.java:572)
	at com.android.tools.idea.rendering.RenderTask.lambda$inflate$5(RenderTask.java:698)
	at java.util.concurrent.CompletableFuture$AsyncSupply.run(CompletableFuture.java:1590)
	at java.util.concurrent.ThreadPoolExecutor.runWorker(ThreadPoolExecutor.java:1149)
	at java.util.concurrent.ThreadPoolExecutor$Worker.run(ThreadPoolExecutor.java:624)
	at java.lang.Thread.run(Thread.java:748)

If I clean the project, I get a slightly different error:

Missing classes: The following classes could not be found:
 splitties.views.dsl.idepreview.UiPreView

What is the Splitties DSL equivalent to anko’s

alert {
    customView { ... }
}

?

I'm migrating from anko, and can't get the same effect for padding and margins: Here is an example:

return scrollView {

verticalLayout {

}.lparams {

margin = dip(buttonMargin) // Margin for all sides, except bottom (it doesn't work in ScrollView).

}

bottomPadding = dip(2 * buttonMargin) // Special padding for bottom of ScrollView.

}

I tried something like:

private val scrollView = view(::ScrollView) {

add(content, lParams {

margin = dip(buttonMargin) // Margin for all sides, except bottom (it doesn't work in ScrollView).

width = matchParent

height = matchParent

bottomPadding = dip(buttonMargin) // Special padding for bottom of ScrollView.

})

}

override val root = verticalLayout {

background = resources.getDrawable(android.R.color.white, null)

add(scrollView, lParams {

margin = dip(buttonMargin) // Margin for all sides, except bottom (it doesn't work in ScrollView).

width = matchParent

height = matchParent

bottomPadding = dip(buttonMargin) // Special padding for bottom of ScrollView.

})

}

But no margins/padding is applied at all. What's wrong?

@louiscad, if I want to add some

View

into

ViewGroup

dynamically, after it's creation, is there any way to do that shorter / with Splitties DSL?

root.addView(childView, LinearLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, ViewGroup.LayoutParams.MATCH_PARENT))

All samples I've seen follow one (most common) workflow of static UI. But I need to add some views dynamically.

One of the most irritating things in Android is adding a shadow or rounded corners. I haven’t spotted anything that makes this easier in Splitties (without using CardViews). Is there something? Or could we build it? Like, say,

view { cornerRadius = 3 }

or

view { shadowRadius = 2 }

It looks like that sometimes Android Studio (3.4.2) fails to perform code analysis for files with Splitties UI. Actually it does that after reload/invalidation, but during code creation it sometimes annoys. Does someone experience the same behavior? I expect that the problem is on Kotlin compiler side, am I right?

As I've promised - here is my experience with two cool libs: Splitties DSL and Conductor. They combine pretty good with each other, and deliver strong feeling that this approach should be standard for Android development. Here are main benefits: 1. Single activity, no fragments, zero lifecycle management. 2. Cool direct navigation between Controllers without activity listeners and all that stuff. 3. Cool and fast UI generation without xml. 4. Very simple implementation of MVP - imo best approach in case of generated UI. Here is some sample code I've extracted and refactored for simplicity (one piece of code is better than thousand words :))

class ItemsUi(override val ctx: Context,
              private val displayHelper: DisplayHelper) // Any other stuff for abstraction from platform...
    : Ui {

    /**
     * Holder for buttons.
     */
    val content = verticalLayout {
    }

    /**
     * Root of Ui. Should be below all other properties for correct initialization order.
     */
    override val root = verticalLayout {
        background = resources.getDrawable(android.R.color.white, null)

        add(content, lParams {
            width = matchParent
            height = matchParent
        })
    }

    /**
     * Creates UI based on data.
     */
    fun createUi(items: List<Item>?) {
        content.apply {
            for (item in items) {
                add(createButton(item), lParams {
                    width = matchParent
                    height = matchParent
                })
            }
        }
    }
}

class ItemsPresenter(ownerScope: CoroutineScope,
                     private var view: View?,
                     private val loadItemsCommand: LoadItemsCommand) : CoroutineScope by ownerScope {
    interface View {
        fun showItems(items: List<Item>?)
    }

    fun loadItems() = launch(<http://Dispatchers.IO|Dispatchers.IO>) {
        val items = loadItemsCommand(null)

        withContext(Dispatchers.Main) {
            view?.showItems(items)
        }
    }

    fun stop() {
        view = null
    }
}

class ItemsController : Controller(),
        CoroutineScope,
        KoinComponent,
        ItemsPresenter.View {

    private val itemsPresenter: ItemsPresenter by inject { parametersOf(this, this) }
    private lateinit var itemsUi: ItemsUi

    override fun onCreateView(inflater: LayoutInflater, container: ViewGroup): View {
        itemsPresenter.loadItems()

        val displayHelper: DisplayHelper by inject()
        itemsUi = ItemsUi(container.context, displayHelper, ::onItemSelection)
        // or, alternatively, you can do something like that:
        // itemsUi.button.onClick {
        //            val pushHandler = FadeChangeHandler(false)
        //            val popHandler = FadeChangeHandler()
        //
        //            router.pushController(RouterTransaction.with(ItemDetailsController())
        //                    .pushChangeHandler(pushHandler)
        //                    .popChangeHandler(popHandler))
        //        }
        return itemsUi.root
    }

    override fun onDestroyView(view: View) {
        super.onDestroyView(view)
        itemsPresenter.stop()
    }

    override fun showItems(items: List<Item>?) {
        itemsUi.createUi(items)
    }

    private fun onItemSelection(itemId: Int) {
        val pushHandler = FadeChangeHandler(false)
        val popHandler = FadeChangeHandler()

        router.pushController(RouterTransaction.with(ItemDetailsController())
                .pushChangeHandler(pushHandler)
                .popChangeHandler(popHandler))
    }

    override val coroutineContext: CoroutineContext by lazy {
        (activity as MainActivity).coroutineContext
    }

}

Does

View.wrapInRecyclerView()

provide a performance increase? Or is there some other reason for it?

How would you go about supporting more than one cell type in RecyclerView? I would like to implement a data-driven approach that draws a different view according to what the current item of a list specifies.

@louiscad In Splitties DSL you have sample for different interfaces for Android/iOS

interface AndroidInboxUi : InboxUiContract, Ui
interface IOSInboxUi : InboxUiContract {
    val root: UIView
}

Is it actually used in some app with Kotlin Native?

Tried to find out how to create ToggleButton in Splitties, and the only way I've found is view(::ToggleButton). That is not so common widget, so I guess it is OK. But the question is with basic samples:

val launchDemoBtn = button {
    textResource = R.string.go_to_the_demo
}

It doesn't work for me - just empty space is shown, and no errors. I didn't notice this initially because I started right from AppCompat samples (they work pretty well :))

Is there any practice how to initialize bunch of properties for single view? It looks like that the order is important from performance and result perspectives. For example, isChecked property for ToggleButton adds some time for initialization, and moreover its position in initialization influences the result (if it is before `textOn`/`textOff`, then

text

property should be initialized, and if it is after - everything works without this extra property). Maybe the is some technique for initialization in one transaction, without intermediate UI invalidation?

am i adding the right dependency?

Is It possibile to have dsl preview without UI class? UI class is useful for activity/fragment, but i think is an overhead for a customview

For Views DSL users: Would you use such an overload of the

add

extension for

ViewGroup

?

inline fun <V : View> ViewGroup.add(
    view: V,
    lp: ViewGroup.LayoutParams,
    beforeChild: View? = null,
    afterChild: View? = null
): V

If not, would it annoy you to see it in autocomplete? (😤 reaction is fine for that)

I migrated to Android Studio 3.5, and found a very strange bug in Code Analysis - in runs in a cycle on my Splitties DSL files because of internal crashes. I tried to localize the problem, and found that the root cause is in AppCompat split. It fails on the following declaration:

private val appCompatStyles = AppCompatStyles(ctx)
    private val buttons = appCompatStyles.button

    val button = buttons.default {
    }

while the following replacement works well:

val button = view<AppCompatButton>(::AppCompatButton){
            }

@louiscad I found one split with coroutines (https://github.com/LouisCAD/Splitties/tree/master/modules/views-coroutines), but looks like it is not relevant for my use case. I just want to handle one and only one click on button and start long-lasting process in background. There are several solutions on how to lock consequent clicks on that button until process finishes. One is suggested by Roman Elizarov (https://github.com/Kotlin/kotlinx.coroutines/blob/master/ui/coroutines-guide-ui.md):

fun View.onClick(action: suspend (View) -> Unit) {
    // launch one actor
    val eventActor = GlobalScope.actor<View>(Dispatchers.Main) {
        for (event in channel) action(event)
    }
    // install a listener to activate this actor
    setOnClickListener { 
        eventActor.offer(it)
    }
}

Another cool guy here suggests even better dsl solution: https://www.hellsoft.se/even-smarter-async-with-coroutine-actors/ But my dream was to have some handy solution like

View.awaitOneClick

(maybe,

View.processOneClick

?) that incorporates waiting for coroutine to finish and then unblocks button. My current solution is pretty simple - just disable button before long operation, and enable it after its completion. How do you handle the similar tasks, and what is the real necessity for

View.awaitOneClick

?

Some folks at Square also believe xml UIs are the past and made this: https://github.com/square/contour What do you think about it? Also, any thoughts relative to Splitties Views DSL?

When using Views DSL for

ConstraintLayout

, would you prefer to use

below(view)

instead of

topToBottomOf(view)

,

above

instead of

bottomToTopOf

,

before

instead of

endToStartOf

and

after

instead of

startToEndOf

? I'm considering adding these into the ConstraintLayout module as aliases to the existing ones.

Hi 🙂 I’m here from Louis’ mention in the other thread, I’m not sure how I missed Splitties, seems great! I’m looking through the available splits and have a question about lifecycle coroutines:

coroutineScope

and

lifecycleScope

and similarly defined to be

active until the Lifecycle[Owner] is destroyed.

. I’m not using coroutines in production yet, so maybe that’s a silly question, but do those scopes suspend if the lifecycle is in stopped state (similarly to LiveData waiting before delivering values)? Is it even possible (and reasonable) with scopes?

Another question about View DSL: are there any examples for binding streams to specific view methods? I’m a big fan of DataBinding, and I’m curious if there’s some already established patter to e.g. directly pass

LiveData<String>

to

TextView::setText

? Probably couple of extension methods would be enough for majority of use cases, but I imagine something like adapters/converters would make view dsl very interesting