Introduction
I often use a Craft, and Craft’s textual content editor has a terrific writing really feel and I’ve no complaints, so I assumed I desire a Craft-like textual content editor for Jetpack Compose.
Craft – The Future of Documents
so I began making a library known as text-editor-compose.
GitHub – kaleidot725/text-editor-compose: A simple text editor library for Jetpack Compose
Options
text-editor-compose has options as beneath.
Edit textual content
Edit the textual content on every line, add and delete textual content as follows.
Line break
Insert line breaks or delete line breaks.
Line quantity
Show line numbers.
Chosen line
Show the chosen line.
Roadmap
A number of line choice
Copy and delete should not supported for a number of strains. So I’m planning so as to add a a number of line choice
Bodily Keyboard
Bodily keyboard is just not supported. So I’m planning so as to add bodily keyboard help.
Utilization
This library is straightforward to make use of, simply observe the steps beneath so as to add a dependency and write codes.
Step 1: Add the JitPack repository to construct.gradle
allprojects {
repositories {
...
maven { url 'https://jitpack.io' }
}
}
Step 2: Add the library to the dependencies
dependencies {
implementation 'com.github.kaleidot725:text-editor-compose:0.1.0'
}
Step 3: Declare TextEditor & TextEditorState
class MainActivity : ComponentActivity() {
override enjoyable onCreate(savedInstanceState: Bundle?) {
tremendous.onCreate(savedInstanceState)
setContent {
SampleTheme {
val textEditorState by rememberTextEditorState(strains = DemoText.strains())
TextEditor(
textEditorState = textEditorState,
onUpdatedState = { },
modifier = Modifier.fillMaxSize()
)
}
}
}
}
Step 4: Customise what every row shows
class MainActivity : ComponentActivity() {
override enjoyable onCreate(savedInstanceState: Bundle?) {
tremendous.onCreate(savedInstanceState)
setContent {
SampleTheme {
val textEditorState by rememberTextEditorState(strains = DemoText.strains())
TextEditor(
textEditorState = textEditorState,
onUpdatedState = { },
modifier = Modifier.fillMaxSize(),
decorationBox = { index, isSelected, innerTextField ->
val backgroundColor = if (isSelected) Coloration(0x8000ff00) else Coloration.White
Row(modifier = Modifier.background(backgroundColor)) {
Textual content(textual content = (index + 1).toString().padStart(3, '0'))
Spacer(modifier = Modifier.width(4.dp))
innerTextField(modifier = Modifier.fillMaxWidth())
}
}
)
}
}
}
}
Conclusion
text-eiditor-compose has carried out minimal options. I’m planning so as to add new options.
GitHub – kaleidot725/text-editor-compose: A simple text editor library for Jetpack Compose