tianzixuan/Doric
Archived
1
0
Fork 0
Code Issues Pull Requests 1 Actions Packages Projects Releases Wiki Activity

feat:fix color ts and listdemo refact

Browse Source
This commit is contained in:
pengfei.zhou 2019-11-20 09:38:54 +08:00
parent 1b23dbd653
commit 412b65c864
2 changed files with 25 additions and 25 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

48
demo/src/ListDemo.ts
View File

@ -1,4 +1,5 @@
import { Group, Panel, List, text, gravity, Color, Stack, LayoutSpec, list, NativeCall, listItem, log, vlayout, Gravity, hlayout } from "doric"; import { Group, Panel, List, text, gravity, Color, Stack, LayoutSpec, list, NativeCall, listItem, log, vlayout, Gravity, hlayout, Text } from "doric";
import { O_TRUNC } from "constants";
const colors = [ const colors = [
"#f0932b", "#f0932b",
"#eb4d4b", "#eb4d4b",
@ -10,7 +11,7 @@ const colors = [
@Entry @Entry
class ListPanel extends Panel { class ListPanel extends Panel {
build(rootView: Group): void { build(rootView: Group): void {
rootView.addChild(vlayout([ vlayout([
text({ text({
text: "ListDemo", text: "ListDemo",
layoutConfig: { layoutConfig: {
@ -26,6 +27,7 @@ class ListPanel extends Panel {
list({ list({
itemCount: 1000, itemCount: 1000,
renderItem: (idx: number) => { renderItem: (idx: number) => {
let counter!: Text
return listItem( return listItem(
hlayout([ hlayout([
text({ text({
@ -39,43 +41,40 @@ class ListPanel extends Panel {
textColor: Color.parse("#ffffff"), textColor: Color.parse("#ffffff"),
textSize: 20, textSize: 20,
height: 50, height: 50,
bgColor: Color.parse('#00ff00'),
}), }),
text({ text({
layoutConfig: {
widthSpec: LayoutSpec.EXACTLY,
heightSpec: LayoutSpec.EXACTLY,
alignment: gravity().center(),
weight: 1,
},
text: `Right`,
textAlignment: gravity().right(),
textColor: Color.parse("#ffffff"), textColor: Color.parse("#ffffff"),
textSize: 20, textSize: 20,
height: 50,
bgColor: Color.parse('#00ffff'),
}).also(it => { }).also(it => {
let start = 0 counter = it
it.onClick = () => { it.layoutConfig = {
log(`clicked text:${start}`) widthSpec: LayoutSpec.WRAP_CONTENT,
it.text = `${start++}` heightSpec: LayoutSpec.WRAP_CONTENT,
margin: {
left: 10,
}
} }
}), })
]).also(it => { ]).also(it => {
it.layoutConfig = { it.layoutConfig = {
widthSpec: LayoutSpec.AT_MOST, widthSpec: LayoutSpec.AT_MOST,
heightSpec: LayoutSpec.WRAP_CONTENT, heightSpec: LayoutSpec.WRAP_CONTENT,
alignment: gravity().center(), margin: {
bottom: 2,
}
}
it.gravity = gravity().center()
it.bgColor = Color.parse(colors[idx % colors.length])
let clicked = 0
it.onClick = () => {
counter.text = `Item Clicked ${++clicked}`
} }
it.bgColor = Color.parse('#ffffff')
}) })
).also(it => { ).also(it => {
it.bgColor = Color.parse(colors[idx % colors.length])
it.layoutConfig = { it.layoutConfig = {
widthSpec: LayoutSpec.AT_MOST, widthSpec: LayoutSpec.AT_MOST,
heightSpec: LayoutSpec.EXACTLY, heightSpec: LayoutSpec.WRAP_CONTENT,
} }
it.height = 100
it.onClick = () => { it.onClick = () => {
log(`Click item at ${idx}`) log(`Click item at ${idx}`)
it.height += 10 it.height += 10
@ -99,6 +98,7 @@ class ListPanel extends Panel {
widthSpec: LayoutSpec.AT_MOST, widthSpec: LayoutSpec.AT_MOST,
heightSpec: LayoutSpec.AT_MOST, heightSpec: LayoutSpec.AT_MOST,
} }
})) it.bgColor = Color.WHITE
}).in(rootView)
} }
} }

2
js-framework/src/util/color.ts
View File

@ -35,7 +35,7 @@ export class Color implements Modeling {
_value: number = 0 _value: number = 0
constructor(v: number) { constructor(v: number) {
this._value = v this._value = v | 0x0
} }
static parse(str: string) { static parse(str: string) {