Modernize tutorial final code

It's time to get the Tutorial caught up with undeprecated API. This PR modifies only the final tutorial module. Once we're happy with the code, I'll back port the changes and update the prose in follow ups.

- Use `AndroidScreen` and drop `ViewRegistry`
- Use `View.setBackHandler`
- Use `TextController`
- More consistent naming, code style for actions and event handlers in `Screen` renderings

I did not introduce `RenderContext.eventHandler {}`, that seems like it would just be confusing to a newcomer.

Also not introducing big new blocks of material, in particular not introducing `Overlay`. I do think we should do that, but for this release I just want to focus on getting the deprecated code deleted.

samples/dungeon/app/src/main/java/com/squareup/sample/dungeon/DungeonAppWorkflow.kt

@@ -33,7 +33,7 @@ class DungeonAppWorkflow(
   data class DisplayBoardsListScreen(
     val boards: List<Board>,
     val onBoardSelected: (index: Int) -> Unit
-  ) : Screen
+  ): Screen
 
   override fun initialState(
     props: Props,

samples/tutorial/README.md

@@ -13,7 +13,7 @@ To help with the setup, we have created a few helper modules:
 
 - `tutorial-views`: A set of 3 views for the 3 screens we will be building, `Welcome`, `TodoList`,
   and `TodoEdit`.
-- `tutorial-base`: This is the starting point to build out the tutorial. It contains layouts that host the views from `TutorialViews` to see how they display.
+- `tutorial-base`: This is the starting point to build out the tutorial.
 - `tutorial-final`: This is an example of the completed tutorial - could be used as a reference if
   you get stuck.
 

samples/tutorial/tutorial-2-complete/src/main/java/workflow/tutorial/RootWorkflow.kt

@@ -5,8 +5,8 @@ import com.squareup.workflow1.StatefulWorkflow
 import com.squareup.workflow1.action
 import com.squareup.workflow1.renderChild
 import com.squareup.workflow1.ui.WorkflowUiExperimentalApi
-import com.squareup.workflow1.ui.backstack.BackStackScreen
-import com.squareup.workflow1.ui.backstack.toBackStackScreen
+import com.squareup.workflow1.ui.container.BackStackScreen
+import com.squareup.workflow1.ui.container.toBackStackScreen
 import workflow.tutorial.RootWorkflow.State
 import workflow.tutorial.RootWorkflow.State.Todo
 import workflow.tutorial.RootWorkflow.State.Welcome

samples/tutorial/tutorial-2-complete/src/main/java/workflow/tutorial/TutorialActivity.kt

@@ -11,12 +11,10 @@ import androidx.lifecycle.viewModelScope
 import com.squareup.workflow1.ui.ViewRegistry
 import com.squareup.workflow1.ui.WorkflowLayout
 import com.squareup.workflow1.ui.WorkflowUiExperimentalApi
-import com.squareup.workflow1.ui.backstack.BackStackContainer
 import com.squareup.workflow1.ui.renderWorkflowIn
 import kotlinx.coroutines.flow.StateFlow
 
 private val viewRegistry = ViewRegistry(
-    BackStackContainer,
     WelcomeLayoutRunner,
     TodoListLayoutRunner
 )

samples/tutorial/tutorial-3-complete/src/main/java/workflow/tutorial/RootWorkflow.kt

@@ -5,8 +5,8 @@ import com.squareup.workflow1.StatefulWorkflow
 import com.squareup.workflow1.action
 import com.squareup.workflow1.renderChild
 import com.squareup.workflow1.ui.WorkflowUiExperimentalApi
-import com.squareup.workflow1.ui.backstack.BackStackScreen
-import com.squareup.workflow1.ui.backstack.toBackStackScreen
+import com.squareup.workflow1.ui.container.BackStackScreen
+import com.squareup.workflow1.ui.container.toBackStackScreen
 import workflow.tutorial.RootWorkflow.State
 import workflow.tutorial.RootWorkflow.State.Todo
 import workflow.tutorial.RootWorkflow.State.Welcome

samples/tutorial/tutorial-3-complete/src/main/java/workflow/tutorial/TutorialActivity.kt

@@ -11,12 +11,10 @@ import androidx.lifecycle.viewModelScope
 import com.squareup.workflow1.ui.ViewRegistry
 import com.squareup.workflow1.ui.WorkflowLayout
 import com.squareup.workflow1.ui.WorkflowUiExperimentalApi
-import com.squareup.workflow1.ui.backstack.BackStackContainer
 import com.squareup.workflow1.ui.renderWorkflowIn
 import kotlinx.coroutines.flow.StateFlow
 
 private val viewRegistry = ViewRegistry(
-    BackStackContainer,
     WelcomeLayoutRunner,
     TodoListLayoutRunner,
     TodoEditLayoutRunner

samples/tutorial/tutorial-4-complete/src/main/java/workflow/tutorial/RootWorkflow.kt

@@ -5,8 +5,8 @@ import com.squareup.workflow1.StatefulWorkflow
 import com.squareup.workflow1.action
 import com.squareup.workflow1.renderChild
 import com.squareup.workflow1.ui.WorkflowUiExperimentalApi
-import com.squareup.workflow1.ui.backstack.BackStackScreen
-import com.squareup.workflow1.ui.backstack.toBackStackScreen
+import com.squareup.workflow1.ui.container.BackStackScreen
+import com.squareup.workflow1.ui.container.toBackStackScreen
 import workflow.tutorial.RootWorkflow.State
 import workflow.tutorial.RootWorkflow.State.Todo
 import workflow.tutorial.RootWorkflow.State.Welcome

samples/tutorial/tutorial-4-complete/src/main/java/workflow/tutorial/TutorialActivity.kt

@@ -11,12 +11,10 @@ import androidx.lifecycle.viewModelScope
 import com.squareup.workflow1.ui.ViewRegistry
 import com.squareup.workflow1.ui.WorkflowLayout
 import com.squareup.workflow1.ui.WorkflowUiExperimentalApi
-import com.squareup.workflow1.ui.backstack.BackStackContainer
 import com.squareup.workflow1.ui.renderWorkflowIn
 import kotlinx.coroutines.flow.StateFlow
 
 private val viewRegistry = ViewRegistry(
-  BackStackContainer,
   WelcomeLayoutRunner,
   TodoListLayoutRunner,
   TodoEditLayoutRunner

samples/tutorial/tutorial-final/src/main/java/workflow/tutorial/RootWorkflow.kt

@@ -4,16 +4,17 @@ import com.squareup.workflow1.Snapshot
 import com.squareup.workflow1.StatefulWorkflow
 import com.squareup.workflow1.action
 import com.squareup.workflow1.renderChild
+import com.squareup.workflow1.ui.Screen
 import com.squareup.workflow1.ui.WorkflowUiExperimentalApi
-import com.squareup.workflow1.ui.backstack.BackStackScreen
-import com.squareup.workflow1.ui.backstack.toBackStackScreen
+import com.squareup.workflow1.ui.container.BackStackScreen
+import com.squareup.workflow1.ui.container.toBackStackScreen
 import workflow.tutorial.RootWorkflow.State
 import workflow.tutorial.RootWorkflow.State.Todo
 import workflow.tutorial.RootWorkflow.State.Welcome
 import workflow.tutorial.TodoWorkflow.TodoProps
 
 @OptIn(WorkflowUiExperimentalApi::class)
-object RootWorkflow : StatefulWorkflow<Unit, State, Nothing, BackStackScreen<Any>>() {
+object RootWorkflow : StatefulWorkflow<Unit, State, Nothing, BackStackScreen<Screen>>() {
 
   sealed class State {
     object Welcome : State()
@@ -30,10 +31,10 @@ object RootWorkflow : StatefulWorkflow<Unit, State, Nothing, BackStackScreen<Any
     renderProps: Unit,
     renderState: State,
     context: RenderContext
-  ): BackStackScreen<Any> {
+  ): BackStackScreen<Screen> {
 
     // Our list of back stack items. Will always include the "WelcomeScreen".
-    val backstackScreens = mutableListOf<Any>()
+    val backstackScreens = mutableListOf<Screen>()
 
     // Render a child workflow of type WelcomeWorkflow. When renderChild is called, the
     // infrastructure will create a child workflow with state if one is not already running.

samples/tutorial/tutorial-final/src/main/java/workflow/tutorial/TodoEditRunner.kt

@@ -0,0 +1,24 @@
+package workflow.tutorial
+
+import com.squareup.workflow1.ui.ScreenViewRunner
+import com.squareup.workflow1.ui.ViewEnvironment
+import com.squareup.workflow1.ui.WorkflowUiExperimentalApi
+import com.squareup.workflow1.ui.control
+import com.squareup.workflow1.ui.setBackHandler
+import workflow.tutorial.views.databinding.TodoEditViewBinding
+
+@OptIn(WorkflowUiExperimentalApi::class)
+class TodoEditRunner(
+  private val binding: TodoEditViewBinding
+) : ScreenViewRunner<TodoEditScreen> {
+
+  override fun showRendering(
+    rendering: TodoEditScreen,
+    environment: ViewEnvironment
+  ) {
+    binding.root.setBackHandler(rendering.onBackClick)
+    binding.save.setOnClickListener { rendering.onSaveClick() }
+    rendering.title.control(binding.todoTitle)
+    rendering.note.control(binding.todoNote)
+  }
+}

samples/tutorial/tutorial-final/src/main/java/workflow/tutorial/TodoEditScreen.kt

@@ -1,15 +1,21 @@
 package workflow.tutorial
 
+import com.squareup.workflow1.ui.AndroidScreen
+import com.squareup.workflow1.ui.ScreenViewFactory
+import com.squareup.workflow1.ui.TextController
+import com.squareup.workflow1.ui.WorkflowUiExperimentalApi
+import workflow.tutorial.views.databinding.TodoEditViewBinding
+
+@OptIn(WorkflowUiExperimentalApi::class)
 data class TodoEditScreen(
   /** The title of this todo item. */
-  val title: String,
+  val title: TextController,
   /** The contents, or "note" of the todo. */
-  val note: String,
-
-  /** Callbacks for when the title or note changes. */
-  val onTitleChanged: (String) -> Unit,
-  val onNoteChanged: (String) -> Unit,
+  val note: TextController,
 
-  val discardChanges: () -> Unit,
-  val saveChanges: () -> Unit
-)
+  val onBackClick: () -> Unit,
+  val onSaveClick: () -> Unit
+) : AndroidScreen<TodoEditScreen> {
+  override val viewFactory =
+    ScreenViewFactory.fromViewBinding(TodoEditViewBinding::inflate, ::TodoEditRunner)
+}

samples/tutorial/tutorial-final/src/main/java/workflow/tutorial/TodoEditWorkflow.kt

@@ -3,12 +3,14 @@ package workflow.tutorial
 import com.squareup.workflow1.Snapshot
 import com.squareup.workflow1.StatefulWorkflow
 import com.squareup.workflow1.action
+import com.squareup.workflow1.ui.WorkflowUiExperimentalApi
 import workflow.tutorial.TodoEditWorkflow.Output
 import workflow.tutorial.TodoEditWorkflow.Output.Discard
 import workflow.tutorial.TodoEditWorkflow.Output.Save
 import workflow.tutorial.TodoEditWorkflow.EditProps
 import workflow.tutorial.TodoEditWorkflow.State
 
+@OptIn(WorkflowUiExperimentalApi::class)
 object TodoEditWorkflow : StatefulWorkflow<EditProps, State, Output, TodoEditScreen>() {
 
   data class EditProps(
@@ -54,33 +56,20 @@ object TodoEditWorkflow : StatefulWorkflow<EditProps, State, Output, TodoEditScr
     return TodoEditScreen(
         title = renderState.todo.title,
         note = renderState.todo.note,
-        onTitleChanged = { context.actionSink.send(onTitleChanged(it)) },
-        onNoteChanged = { context.actionSink.send(onNoteChanged(it)) },
-        saveChanges = { context.actionSink.send(onSave()) },
-        discardChanges = { context.actionSink.send(onDiscard()) }
+        onSaveClick = { context.actionSink.send(postSave) },
+        onBackClick = { context.actionSink.send(postDiscard) }
     )
   }
 
   override fun snapshotState(state: State): Snapshot? = null
 
-  internal fun onTitleChanged(title: String) = action {
-    state = state.withTitle(title)
-  }
-
-  internal fun onNoteChanged(note: String) = action {
-    state = state.withNote(note)
-  }
-
-  private fun onDiscard() = action {
+  private val postDiscard = action {
     // Emit the Discard output when the discard action is received.
     setOutput(Discard)
   }
 
-  internal fun onSave() = action {
+  internal val postSave = action {
     // Emit the Save output with the current todo state when the save action is received.
     setOutput(Save(state.todo))
   }
-
-  private fun State.withTitle(title: String) = copy(todo = todo.copy(title = title))
-  private fun State.withNote(note: String) = copy(todo = todo.copy(note = note))
 }

samples/tutorial/tutorial-final/src/main/java/workflow/tutorial/TodoListScreen.kt

@@ -1,14 +1,24 @@
 package workflow.tutorial
 
+import com.squareup.workflow1.ui.AndroidScreen
+import com.squareup.workflow1.ui.ScreenViewFactory
+import com.squareup.workflow1.ui.WorkflowUiExperimentalApi
+import workflow.tutorial.views.databinding.TodoListViewBinding
+
 /**
  * This should contain all data to display in the UI.
  *
  * It should also contain callbacks for any UI events, for example:
  * `val onButtonTapped: () -> Unit`.
  */
+@OptIn(WorkflowUiExperimentalApi::class)
 data class TodoListScreen(
   val username: String,
   val todoTitles: List<String>,
   val onTodoSelected: (Int) -> Unit,
-  val onBack: () -> Unit
-)
+  val onBackClick: () -> Unit,
+  val onAddClick: () -> Unit
+): AndroidScreen<TodoListScreen> {
+  override val viewFactory =
+    ScreenViewFactory.fromViewBinding(TodoListViewBinding::inflate, ::TodoListScreenRunner)
+}

samples/tutorial/tutorial-final/src/main/java/workflow/tutorial/TodoListLayoutRunner.kt → samples/tutorial/tutorial-final/src/main/java/workflow/tutorial/TodoListScreenRunner.kt

@@ -1,19 +1,17 @@
 package workflow.tutorial
 
 import androidx.recyclerview.widget.LinearLayoutManager
-import com.squareup.workflow1.ui.LayoutRunner
-import com.squareup.workflow1.ui.LayoutRunner.Companion.bind
+import com.squareup.workflow1.ui.ScreenViewRunner
 import com.squareup.workflow1.ui.ViewEnvironment
-import com.squareup.workflow1.ui.ViewFactory
 import com.squareup.workflow1.ui.WorkflowUiExperimentalApi
-import com.squareup.workflow1.ui.backPressedHandler
+import com.squareup.workflow1.ui.setBackHandler
 import workflow.tutorial.views.TodoListAdapter
 import workflow.tutorial.views.databinding.TodoListViewBinding
 
 @OptIn(WorkflowUiExperimentalApi::class)
-class TodoListLayoutRunner(
+class TodoListScreenRunner(
   private val todoListBinding: TodoListViewBinding
-) : LayoutRunner<TodoListScreen> {
+) : ScreenViewRunner<TodoListScreen> {
 
   private val adapter = TodoListAdapter()
 
@@ -24,9 +22,10 @@ class TodoListLayoutRunner(
 
   override fun showRendering(
     rendering: TodoListScreen,
-    viewEnvironment: ViewEnvironment
+    environment: ViewEnvironment
   ) {
-    todoListBinding.root.backPressedHandler = rendering.onBack
+    todoListBinding.root.setBackHandler(rendering.onBackClick)
+    todoListBinding.add.setOnClickListener { rendering.onAddClick() }
 
     with(todoListBinding.todoListWelcome) {
       text = resources.getString(R.string.todo_list_welcome, rendering.username)
@@ -36,8 +35,4 @@ class TodoListLayoutRunner(
     adapter.onTodoSelected = rendering.onTodoSelected
     adapter.notifyDataSetChanged()
   }
-
-  companion object : ViewFactory<TodoListScreen> by bind(
-      TodoListViewBinding::inflate, ::TodoListLayoutRunner
-  )
 }

samples/tutorial/tutorial-final/src/main/java/workflow/tutorial/TodoListWorkflow.kt

@@ -29,14 +29,15 @@ object TodoListWorkflow : StatelessWorkflow<ListProps, Output, TodoListScreen>()
   ): TodoListScreen {
     val titles = renderProps.todos.map { it.title }
     return TodoListScreen(
-        username = renderProps.username,
-        todoTitles = titles,
-        onTodoSelected = { context.actionSink.send(selectTodo(it)) },
-        onBack = { context.actionSink.send(onBack()) }
+      username = renderProps.username,
+      todoTitles = titles.map { it.textValue },
+      onTodoSelected = { context.actionSink.send(selectTodo(it)) },
+      onBackClick = { context.actionSink.send(postGoBack) },
+      onAddClick = { context.actionSink.send(postNewTodo) }
     )
   }
 
-  private fun onBack() = action {
+  private val postGoBack = action {
     // When an onBack action is received, emit a Back output.
     setOutput(Back)
   }
@@ -46,7 +47,7 @@ object TodoListWorkflow : StatelessWorkflow<ListProps, Output, TodoListScreen>()
     setOutput(SelectTodo(index))
   }
 
-  private fun new() = action {
+  private val postNewTodo = action {
     // Tell our parent a new todo item should be created.
     setOutput(NewTodo)
   }

samples/tutorial/tutorial-final/src/main/java/workflow/tutorial/TodoModel.kt

@@ -1,6 +1,15 @@
 package workflow.tutorial
 
+import com.squareup.workflow1.ui.TextController
+import com.squareup.workflow1.ui.WorkflowUiExperimentalApi
+
+@OptIn(WorkflowUiExperimentalApi::class)
 data class TodoModel(
-  val title: String,
-  val note: String
-)
+  val title: TextController,
+  val note: TextController
+) {
+  constructor(
+    title: String,
+    note: String
+  ) : this(TextController(title), TextController(note))
+}