Add decorationBox

Author: kaleidot725

app/src/main/java/jp/kaleidot725/sample/MainActivity.kt

@@ -4,14 +4,17 @@ import android.os.Bundle
 import androidx.activity.ComponentActivity
 import androidx.activity.compose.setContent
 import androidx.compose.foundation.background
-import androidx.compose.foundation.layout.Box
 import androidx.compose.foundation.layout.Row
 import androidx.compose.foundation.layout.Spacer
 import androidx.compose.foundation.layout.fillMaxSize
+import androidx.compose.foundation.layout.fillMaxWidth
 import androidx.compose.foundation.layout.width
+import androidx.compose.material.Scaffold
 import androidx.compose.material.Text
+import androidx.compose.material.TopAppBar
+import androidx.compose.runtime.Composable
 import androidx.compose.runtime.getValue
-import androidx.compose.runtime.setValue
+import androidx.compose.ui.Alignment
 import androidx.compose.ui.Modifier
 import androidx.compose.ui.graphics.Color
 import androidx.compose.ui.unit.dp
@@ -27,61 +30,51 @@ class MainActivity : ComponentActivity() {
                 val textEditorState by rememberTextEditorState(lines = DemoText.lines())
                 TextEditor(
                     textEditorState = textEditorState,
-                    onUpdatedState = { },
+                    onUpdatedState = { /** Save Action */ },
                     modifier = Modifier.fillMaxSize()
-                )
+                ) { index, isSelected, innerTextField ->
+                    val backgroundColor = if (isSelected) Color.Red else Color.White
+                    Row(modifier = Modifier.background(backgroundColor)) {
+                        Text(text = (index + 1).toString().padStart(3, '0'))
+                        Spacer(modifier = Modifier.width(4.dp))
+                        innerTextField(modifier = Modifier.fillMaxWidth())
+                    }
+                }
             }
         }
     }
 }
 
 private val DemoText = """
-    アリスは川辺でおねえさんのよこにすわって、
-    なんにもすることがないのでとても退屈（たいくつ）しはじめていました。
-    一、二回はおねえさんの読んでいる本をのぞいてみたけれど、そこには絵も会話もないのです。
-    「絵や会話のない本なんて、なんの役にもたたないじゃないの」とアリスは思いました。
-    そこでアリスは、頭のなかで、ひなぎくのくさりをつくったら楽しいだろうけれど、
-    起きあがってひなぎくをつむのもめんどくさいし、どうしようかと考えていました
-    （といっても、昼間で暑いし、とってもねむくて頭もまわらなかったので、これもたいへんだったのですが）。
-    そこへいきなり、ピンクの目をした白うさぎが近くを走ってきたのです。
-    それだけなら、そんなにめずらしいことでもありませんでした。さらにアリスとしては、
-    そのうさぎが「どうしよう！　どうしよう！　ちこくしちゃうぞ！」とつぶやくのを聞いたときも、
-    それがそんなにへんてこだとは思いませんでした（あとから考えてみたら、これも不思議に思うべきだったのですけれど、
-    でもこのときには、それがごく自然なことに思えたのです）。
-    アリスは川辺でおねえさんのよこにすわって、
-    なんにもすることがないのでとても退屈（たいくつ）しはじめていました。
-    一、二回はおねえさんの読んでいる本をのぞいてみたけれど、そこには絵も会話もないのです。
-    「絵や会話のない本なんて、なんの役にもたたないじゃないの」とアリスは思いました。
-    そこでアリスは、頭のなかで、ひなぎくのくさりをつくったら楽しいだろうけれど、
-    起きあがってひなぎくをつむのもめんどくさいし、どうしようかと考えていました
-    （といっても、昼間で暑いし、とってもねむくて頭もまわらなかったので、これもたいへんだったのですが）。
-    そこへいきなり、ピンクの目をした白うさぎが近くを走ってきたのです。
-    それだけなら、そんなにめずらしいことでもありませんでした。さらにアリスとしては、
-    そのうさぎが「どうしよう！　どうしよう！　ちこくしちゃうぞ！」とつぶやくのを聞いたときも、
-    それがそんなにへんてこだとは思いませんでした（あとから考えてみたら、これも不思議に思うべきだったのですけれど、
-    でもこのときには、それがごく自然なことに思えたのです）。
-    アリスは川辺でおねえさんのよこにすわって、
-    なんにもすることがないのでとても退屈（たいくつ）しはじめていました。
-    一、二回はおねえさんの読んでいる本をのぞいてみたけれど、そこには絵も会話もないのです。
-    「絵や会話のない本なんて、なんの役にもたたないじゃないの」とアリスは思いました。
-    そこでアリスは、頭のなかで、ひなぎくのくさりをつくったら楽しいだろうけれど、
-    起きあがってひなぎくをつむのもめんどくさいし、どうしようかと考えていました
-    （といっても、昼間で暑いし、とってもねむくて頭もまわらなかったので、これもたいへんだったのですが）。
-    そこへいきなり、ピンクの目をした白うさぎが近くを走ってきたのです。
-    それだけなら、そんなにめずらしいことでもありませんでした。さらにアリスとしては、
-    そのうさぎが「どうしよう！　どうしよう！　ちこくしちゃうぞ！」とつぶやくのを聞いたときも、
-    それがそんなにへんてこだとは思いませんでした（あとから考えてみたら、これも不思議に思うべきだったのですけれど、
-    でもこのときには、それがごく自然なことに思えたのです）。
-    アリスは川辺でおねえさんのよこにすわって、
-    なんにもすることがないのでとても退屈（たいくつ）しはじめていました。
-    一、二回はおねえさんの読んでいる本をのぞいてみたけれど、そこには絵も会話もないのです。
-    「絵や会話のない本なんて、なんの役にもたたないじゃないの」とアリスは思いました。
-    そこでアリスは、頭のなかで、ひなぎくのくさりをつくったら楽しいだろうけれど、
-    起きあがってひなぎくをつむのもめんどくさいし、どうしようかと考えていました
-    （といっても、昼間で暑いし、とってもねむくて頭もまわらなかったので、これもたいへんだったのですが）。
-    そこへいきなり、ピンクの目をした白うさぎが近くを走ってきたのです。
-    それだけなら、そんなにめずらしいことでもありませんでした。さらにアリスとしては、
-    そのうさぎが「どうしよう！　どうしよう！　ちこくしちゃうぞ！」とつぶやくのを聞いたときも、
-    それがそんなにへんてこだとは思いませんでした（あとから考えてみたら、これも不思議に思うべきだったのですけれど、
-    でもこのときには、それがごく自然なことに思えたのです）。
+Android Inc. was founded in Palo Alto, California, 
+in October 2003 by Andy Rubin, Rich Miner, Nick Sears, 
+and Chris White.[20][21] Rubin described the Android project as having "tremendous potential in 
+developing smarter mobile devices that are more aware of its owner's location and preferences".[21] 
+The early intentions of the company were to develop an advanced operating system for digital cameras, 
+and this was the basis of its pitch to investors in April 2004.[22] 
+The company then decided that the market for cameras was not large enough for its goals, 
+and five months later it had diverted its efforts and was pitching Android as a handset operating system that would rival Symbian and Microsoft Windows Mobile.[22][23]
+Rubin had difficulty attracting investors early on, and Android was facing eviction from its office space. 
+Steve Perlman, a close friend of Rubin, brought him ${'$'}10,000 in cash in an envelope, 
+and shortly thereafter wired an undisclosed amount as seed funding. 
+Perlman refused a stake in the company, and has stated "I did it because I believed in the thing, and I wanted to help Andy."[24][25]
+
+In 2005, Rubin tried to negotiate deals with Samsung[26] and HTC.[27] Shortly afterwards, 
+Google acquired the company in July of that year for at least ${'$'}50 million;[21][28] 
+this was Google's "best deal ever" according to Google's then-vice president of corporate development, 
+David Lawee, in 2010.[26] Android's key employees, including Rubin, Miner, Sears, and White, 
+joined Google as part of the acquisition.[21] Not much was known about the secretive Android Inc. at the time, 
+with the company having provided few details other than that it was making software for mobile phones.[21] 
+At Google, the team led by Rubin developed a mobile device platform powered by the Linux kernel. 
+Google marketed the platform to handset makers and carriers on the promise of providing a flexible, upgradeable system.[29] 
+Google had "lined up a series of hardware components and software partners and signaled to carriers that it was open to various degrees of cooperation".[attribution needed][30]
+
+Speculation about Google's intention to enter the mobile communications market continued to build through December 2006.
+[31] An early prototype had a close resemblance to a BlackBerry phone, with no touchscreen and a physical QWERTY keyboard, 
+but the arrival of 2007's Apple iPhone meant that Android "had to go back to the drawing board".[32][33] 
+Google later changed its Android specification documents to state that "Touchscreens will be supported", 
+although "the Product was designed with the presence of discrete physical buttons as an assumption, 
+therefore a touchscreen cannot completely replace physical buttons".[34] By 2008, 
+both Nokia and BlackBerry announced touch-based smartphones to rival the iPhone 3G, and Android's focus eventually switched to just touchscreens. 
+The first commercially available smartphone running Android was the HTC Dream, also known as T-Mobile G1, announced on September 23, 2008.[35][36]
 """.trimIndent()

texteditor/build.gradle

@@ -65,7 +65,7 @@ afterEvaluate {
                 from components.release
                 groupId = 'com.github.kaleidot725'
                 artifactId = 'text-editor-compose'
-                version = '0.1.0-beta03'
+                version = '0.1.0'
             }
         }
     }

texteditor/src/main/java/jp/kaleidot725/texteditor/view/TextEditor.kt

@@ -14,11 +14,18 @@ import androidx.compose.ui.platform.LocalFocusManager
 import jp.kaleidot725.texteditor.state.EditableTextEditorState
 import jp.kaleidot725.texteditor.state.TextEditorState
 
+typealias DecorationBoxComposable = @Composable (
+    index: Int,
+    isSelected: Boolean,
+    innerTextField: @Composable (modifier: Modifier) -> Unit
+) -> Unit
+
 @Composable
 fun TextEditor(
     textEditorState: TextEditorState,
     onUpdatedState: () -> Unit,
-    modifier: Modifier = Modifier
+    modifier: Modifier = Modifier,
+    decorationBox: DecorationBoxComposable = { _, _, innerTextField -> innerTextField(Modifier) },
 ) {
     LazyColumn(modifier = modifier) {
         itemsIndexed(
@@ -33,32 +40,34 @@ fun TextEditor(
                 if (textFieldState.isSelected) focusRequester.requestFocus()
             }
 
-            TextField(
-                textFieldValue = textFieldState.value,
-                onUpdateText = { newText ->
-                    textEditorState.toEditable()
-                        .updateField(targetIndex = index, textFieldValue = newText)
-                    onUpdatedState()
-                },
-                onAddNewLine = { newText ->
-                    textEditorState.toEditable()
-                        .splitField(targetIndex = index, textFieldValue = newText)
-                    onUpdatedState()
-                },
-                onDeleteNewLine = {
-                    textEditorState.toEditable().deleteField(targetIndex = index)
-                    onUpdatedState()
+            decorationBox(index, textFieldState.isSelected) {
+                TextField(
+                    textFieldValue = textFieldState.value,
+                    onUpdateText = { newText ->
+                        textEditorState.toEditable()
+                            .updateField(targetIndex = index, textFieldValue = newText)
+                        onUpdatedState()
+                    },
+                    onAddNewLine = { newText ->
+                        textEditorState.toEditable()
+                            .splitField(targetIndex = index, textFieldValue = newText)
+                        onUpdatedState()
+                    },
+                    onDeleteNewLine = {
+                        textEditorState.toEditable().deleteField(targetIndex = index)
+                        onUpdatedState()
 
-                    // workaround: prevent to hide ime when editor delete newline
-                    focusManager.moveFocus(FocusDirection.Up)
-                },
-                focusRequester = focusRequester,
-                onFocus = {
-                    if (textEditorState.selectedIndices.contains(index)) return@TextField
-                    textEditorState.toEditable().selectField(targetIndex = index)
-                    onUpdatedState()
-                }
-            )
+                        // workaround: prevent to hide ime when editor delete newline
+                        focusManager.moveFocus(FocusDirection.Up)
+                    },
+                    focusRequester = focusRequester,
+                    onFocus = {
+                        if (textEditorState.selectedIndices.contains(index)) return@TextField
+                        textEditorState.toEditable().selectField(targetIndex = index)
+                        onUpdatedState()
+                    }
+                )
+            }
         }
     }
 }