feat:input align the affect to android
This commit is contained in:
@@ -1,5 +1,33 @@
|
||||
import { Panel, Group, scroller, vlayout, layoutConfig, LayoutSpec, Input, Gravity, log } from "doric";
|
||||
import { Panel, Group, scroller, vlayout, layoutConfig, LayoutSpec, Input, Gravity, log, Color, input, text } from "doric";
|
||||
import { title, colors } from "./utils";
|
||||
|
||||
|
||||
function getInput(c: Partial<Input>) {
|
||||
const inputView = input(c)
|
||||
const isFocused = text({
|
||||
layoutConfig: {
|
||||
widthSpec: LayoutSpec.MOST,
|
||||
heightSpec: LayoutSpec.JUST,
|
||||
},
|
||||
height: 50,
|
||||
})
|
||||
const inputed = text({
|
||||
layoutConfig: {
|
||||
widthSpec: LayoutSpec.MOST,
|
||||
heightSpec: LayoutSpec.JUST,
|
||||
},
|
||||
height: 50,
|
||||
})
|
||||
inputView.onFocusChange = (onFocusChange) => {
|
||||
isFocused.text = onFocusChange ? `Focused` : `Unfocused`
|
||||
}
|
||||
inputView.onTextChange = (text) => {
|
||||
inputed.text = `Inputed:${text}`
|
||||
}
|
||||
return [inputView, isFocused, inputed]
|
||||
}
|
||||
|
||||
|
||||
@Entry
|
||||
class InputDemo extends Panel {
|
||||
build(root: Group) {
|
||||
@@ -8,33 +36,34 @@ class InputDemo extends Panel {
|
||||
[
|
||||
|
||||
title("Demo"),
|
||||
(new Input).also(it => {
|
||||
it.layoutConfig = layoutConfig().just().configHeight(LayoutSpec.FIT)
|
||||
it.width = 300
|
||||
it.maxLength=10;
|
||||
it.multiline = false
|
||||
it.hintText = "HintText"
|
||||
it.textAlignment = Gravity.Left
|
||||
it.onTextChange = (s) => {
|
||||
log(`onTextChange:${s}`)
|
||||
}
|
||||
it.onFocusChange = (f) => {
|
||||
log(`onFocusChange:${f}`)
|
||||
}
|
||||
}),
|
||||
(new Input).also(it => {
|
||||
it.layoutConfig = layoutConfig().fit()
|
||||
it.hintText = "HintText"
|
||||
it.hintTextColor = colors[2]
|
||||
it.textAlignment = Gravity.Left
|
||||
it.textColor = colors[3]
|
||||
it.onTextChange = (s) => {
|
||||
log(`onTextChange:${s}`)
|
||||
}
|
||||
it.onFocusChange = (f) => {
|
||||
log(`onFocusChange:${f}`)
|
||||
}
|
||||
it.backgroundColor = colors[1].alpha(0.3)
|
||||
// ...getInput({
|
||||
// layoutConfig: {
|
||||
// widthSpec: LayoutSpec.JUST,
|
||||
// heightSpec: LayoutSpec.FIT,
|
||||
// },
|
||||
// width: 300,
|
||||
// hintText: "Please input something",
|
||||
// border: {
|
||||
// width: 1,
|
||||
// color: Color.GRAY,
|
||||
// },
|
||||
// textSize: 40,
|
||||
// maxLength: 20,
|
||||
// }),
|
||||
...getInput({
|
||||
layoutConfig: {
|
||||
widthSpec: LayoutSpec.FIT,
|
||||
heightSpec: LayoutSpec.FIT,
|
||||
},
|
||||
hintText: "Please input something in one line",
|
||||
border: {
|
||||
width: 1,
|
||||
color: Color.GRAY,
|
||||
},
|
||||
multiline: false,
|
||||
textSize: 20,
|
||||
maxLength: 20,
|
||||
padding: { top: 10, bottom: 11 }
|
||||
}),
|
||||
],
|
||||
{
|
||||
|
Reference in New Issue
Block a user