|
|
|
@ -11,7 +11,6 @@ There is out-of-the box context menu support for TextField and Selectable text.
|
|
|
|
|
To enable standard context menu for a TextField you just need to put it inside DesktopMaterialTheme: |
|
|
|
|
|
|
|
|
|
```kotlin |
|
|
|
|
import androidx.compose.desktop.DesktopMaterialTheme |
|
|
|
|
import androidx.compose.material.Text |
|
|
|
|
import androidx.compose.material.TextField |
|
|
|
|
import androidx.compose.runtime.mutableStateOf |
|
|
|
@ -21,15 +20,13 @@ import androidx.compose.ui.window.singleWindowApplication
|
|
|
|
|
|
|
|
|
|
@OptIn(ExperimentalComposeUiApi::class, androidx.compose.foundation.ExperimentalFoundationApi::class) |
|
|
|
|
fun main() = singleWindowApplication(title = "Context menu") { |
|
|
|
|
DesktopMaterialTheme { //it is mandatory for Context Menu |
|
|
|
|
val text = remember {mutableStateOf("Hello!")} |
|
|
|
|
TextField( |
|
|
|
|
value = text.value, |
|
|
|
|
onValueChange = { text.value = it }, |
|
|
|
|
label = { Text(text = "Input") } |
|
|
|
|
) |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
val text = remember { mutableStateOf("Hello!") } |
|
|
|
|
TextField( |
|
|
|
|
value = text.value, |
|
|
|
|
onValueChange = { text.value = it }, |
|
|
|
|
label = { Text(text = "Input") } |
|
|
|
|
) |
|
|
|
|
} |
|
|
|
|
``` |
|
|
|
|
|
|
|
|
|
Standard context menu for TextField contains the following items based on text selection: Copy, Cut, Paste, Select All. |
|
|
|
@ -37,7 +34,6 @@ Standard context menu for TextField contains the following items based on text s
|
|
|
|
|
Enabling standard context menu for a Text component is similar - you just need to make it selectable: |
|
|
|
|
|
|
|
|
|
```kotlin |
|
|
|
|
import androidx.compose.desktop.DesktopMaterialTheme |
|
|
|
|
import androidx.compose.foundation.text.selection.SelectionContainer |
|
|
|
|
import androidx.compose.material.Text |
|
|
|
|
import androidx.compose.ui.ExperimentalComposeUiApi |
|
|
|
@ -45,12 +41,10 @@ import androidx.compose.ui.window.singleWindowApplication
|
|
|
|
|
|
|
|
|
|
@OptIn(ExperimentalComposeUiApi::class, androidx.compose.foundation.ExperimentalFoundationApi::class) |
|
|
|
|
fun main() = singleWindowApplication(title = "Context menu") { |
|
|
|
|
DesktopMaterialTheme { //it is mandatory for Context Menu |
|
|
|
|
SelectionContainer { |
|
|
|
|
Text("Hello World!") |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
SelectionContainer { |
|
|
|
|
Text("Hello World!") |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
``` |
|
|
|
|
Context menu for text contains just Copy action. |
|
|
|
|
|
|
|
|
@ -58,7 +52,6 @@ Context menu for text contains just Copy action.
|
|
|
|
|
To enable additional context menu items for TextField and Text components, ContextMenuDataProvider and ContextMenuItem elements are used: |
|
|
|
|
|
|
|
|
|
```kotlin |
|
|
|
|
import androidx.compose.desktop.DesktopMaterialTheme |
|
|
|
|
import androidx.compose.foundation.ContextMenuDataProvider |
|
|
|
|
import androidx.compose.foundation.ContextMenuItem |
|
|
|
|
import androidx.compose.foundation.layout.Column |
|
|
|
@ -76,32 +69,30 @@ import androidx.compose.ui.window.singleWindowApplication
|
|
|
|
|
|
|
|
|
|
@OptIn(ExperimentalComposeUiApi::class, androidx.compose.foundation.ExperimentalFoundationApi::class) |
|
|
|
|
fun main() = singleWindowApplication(title = "Context menu") { |
|
|
|
|
DesktopMaterialTheme { //it is mandatory for Context Menu |
|
|
|
|
val text = remember {mutableStateOf("Hello!")} |
|
|
|
|
Column { |
|
|
|
|
ContextMenuDataProvider( |
|
|
|
|
items = { |
|
|
|
|
listOf( |
|
|
|
|
ContextMenuItem("User-defined Action") {/*do something here*/}, |
|
|
|
|
ContextMenuItem("Another user-defined action") {/*do something else*/} |
|
|
|
|
) |
|
|
|
|
} |
|
|
|
|
) { |
|
|
|
|
TextField( |
|
|
|
|
value = text.value, |
|
|
|
|
onValueChange = { text.value = it }, |
|
|
|
|
label = { Text(text = "Input") } |
|
|
|
|
val text = remember { mutableStateOf("Hello!") } |
|
|
|
|
Column { |
|
|
|
|
ContextMenuDataProvider( |
|
|
|
|
items = { |
|
|
|
|
listOf( |
|
|
|
|
ContextMenuItem("User-defined Action") {/*do something here*/ }, |
|
|
|
|
ContextMenuItem("Another user-defined action") {/*do something else*/ } |
|
|
|
|
) |
|
|
|
|
} |
|
|
|
|
) { |
|
|
|
|
TextField( |
|
|
|
|
value = text.value, |
|
|
|
|
onValueChange = { text.value = it }, |
|
|
|
|
label = { Text(text = "Input") } |
|
|
|
|
) |
|
|
|
|
|
|
|
|
|
Spacer(Modifier.height(16.dp)) |
|
|
|
|
Spacer(Modifier.height(16.dp)) |
|
|
|
|
|
|
|
|
|
SelectionContainer { |
|
|
|
|
Text("Hello World!") |
|
|
|
|
} |
|
|
|
|
SelectionContainer { |
|
|
|
|
Text("Hello World!") |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
``` |
|
|
|
|
In this example Text/TextField context menus will be extended with two additional items. |
|
|
|
|
|
|
|
|
@ -109,48 +100,27 @@ In this example Text/TextField context menus will be extended with two additiona
|
|
|
|
|
There is a possibility to create a context menu for an arbitrary application window area. This is implemented using ContextMenuArea API that is |
|
|
|
|
similar to ContextMenuDataProvider. |
|
|
|
|
```kotlin |
|
|
|
|
import androidx.compose.foundation.ContextMenuDataProvider |
|
|
|
|
import androidx.compose.foundation.ContextMenuArea |
|
|
|
|
import androidx.compose.foundation.ContextMenuItem |
|
|
|
|
import androidx.compose.foundation.layout.Column |
|
|
|
|
import androidx.compose.foundation.layout.Spacer |
|
|
|
|
import androidx.compose.foundation.background |
|
|
|
|
import androidx.compose.foundation.layout.Box |
|
|
|
|
import androidx.compose.foundation.layout.height |
|
|
|
|
import androidx.compose.foundation.text.selection.SelectionContainer |
|
|
|
|
import androidx.compose.material.MaterialTheme |
|
|
|
|
import androidx.compose.material.Text |
|
|
|
|
import androidx.compose.material.TextField |
|
|
|
|
import androidx.compose.runtime.mutableStateOf |
|
|
|
|
import androidx.compose.runtime.remember |
|
|
|
|
import androidx.compose.foundation.layout.width |
|
|
|
|
import androidx.compose.ui.ExperimentalComposeUiApi |
|
|
|
|
import androidx.compose.ui.Modifier |
|
|
|
|
import androidx.compose.ui.graphics.Color |
|
|
|
|
import androidx.compose.ui.unit.dp |
|
|
|
|
import androidx.compose.ui.window.singleWindowApplication |
|
|
|
|
|
|
|
|
|
@OptIn(ExperimentalComposeUiApi::class, androidx.compose.foundation.ExperimentalFoundationApi::class) |
|
|
|
|
fun main() = singleWindowApplication(title = "Context menu") { |
|
|
|
|
MaterialTheme { //it is mandatory for Context Menu |
|
|
|
|
val text = remember {mutableStateOf("Hello!")} |
|
|
|
|
Column { |
|
|
|
|
ContextMenuDataProvider( |
|
|
|
|
items = { |
|
|
|
|
listOf( |
|
|
|
|
ContextMenuItem("User-defined Action") {/*do something here*/}, |
|
|
|
|
ContextMenuItem("Another user-defined action") {/*do something else*/} |
|
|
|
|
) |
|
|
|
|
} |
|
|
|
|
) { |
|
|
|
|
TextField( |
|
|
|
|
value = text.value, |
|
|
|
|
onValueChange = { text.value = it }, |
|
|
|
|
label = { Text(text = "Input") } |
|
|
|
|
) |
|
|
|
|
|
|
|
|
|
Spacer(Modifier.height(16.dp)) |
|
|
|
|
|
|
|
|
|
SelectionContainer { |
|
|
|
|
Text("Hello World!") |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
ContextMenuArea(items = { |
|
|
|
|
listOf( |
|
|
|
|
ContextMenuItem("User-defined Action") {/*do something here*/}, |
|
|
|
|
ContextMenuItem("Another user-defined action") {/*do something else*/} |
|
|
|
|
) |
|
|
|
|
}) { |
|
|
|
|
Box(modifier = Modifier.background(Color.Blue).height(100.dp).width(100.dp)) |
|
|
|
|
} |
|
|
|
|
} |
|
|
|
|
``` |
|
|
|
|