63 lines
2.6 KiB
TypeScript
63 lines
2.6 KiB
TypeScript
import { Panel, Group, vlayout, image, layoutConfig, ScaleType, refreshable, Color, pullable, stack, Image, Refreshable, TranslationAnimation, loge, log, list, listItem, text } from "doric";
|
|
import { title, icon_refresh, colors } from "./utils";
|
|
|
|
@Entry
|
|
class MyDemo extends Panel {
|
|
build(root: Group) {
|
|
let refreshed: Refreshable
|
|
let headerImage: Image
|
|
stack(
|
|
[
|
|
refreshed = refreshable({
|
|
onRefresh: () => {
|
|
refreshed.setRefreshing(context, false)
|
|
},
|
|
header: pullable(
|
|
stack([]).apply({
|
|
backgroundColor: Color.RED,
|
|
layoutConfig: layoutConfig().just(),
|
|
width: 100,
|
|
height: 30,
|
|
}),
|
|
{
|
|
startAnimation: () => {
|
|
},
|
|
stopAnimation: () => {
|
|
},
|
|
setPullingDistance: (distance: number) => {
|
|
headerImage.scaleX = headerImage.scaleY = (headerImage.height + distance * 2) / headerImage.height
|
|
},
|
|
}),
|
|
content: list({
|
|
itemCount: 20,
|
|
renderItem: (idx) => {
|
|
return listItem(text({
|
|
text: `Item :${idx}`,
|
|
layoutConfig: layoutConfig().just(),
|
|
width: root.width,
|
|
height: 50,
|
|
textColor: Color.WHITE,
|
|
backgroundColor: colors[idx % colors.length],
|
|
}))
|
|
},
|
|
layoutConfig: layoutConfig().most(),
|
|
}),
|
|
layoutConfig: layoutConfig().most(),
|
|
}).also(v => {
|
|
v.top = 200
|
|
}),
|
|
|
|
headerImage = image({
|
|
imageUrl: "https://img.zcool.cn/community/01e75b5da933daa801209e1ffa4649.jpg@1280w_1l_2o_100sh.jpg",
|
|
layoutConfig: layoutConfig().just(),
|
|
width: root.width,
|
|
height: 200,
|
|
scaleType: ScaleType.ScaleAspectFill,
|
|
}),
|
|
],
|
|
{
|
|
layoutConfig: layoutConfig().most()
|
|
}
|
|
).in(root)
|
|
}
|
|
} |