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

Add Resource Loader for iOS

Browse Source
This commit is contained in:
pengfei.zhou
2021-10-25 16:01:44 +08:00
committed by osborn
parent 4bd4f42f52
commit 235549eea4
40 changed files with 979 additions and 242 deletions
Download Patch File Download Diff File Expand all files Collapse all files

284
doric-demo/src/ImageDemo.ts
View File

@@ -1,4 +1,4 @@
import { Group, Panel, coordinator, text, gravity, Color, LayoutSpec, log, vlayout, scroller, layoutConfig, image, ScaleType, Image, modal } from "doric";
import { Base64Resource, Group, Panel, coordinator, text, gravity, Color, LayoutSpec, log, vlayout, scroller, layoutConfig, image, ScaleType, Image, modal, RemoteResource, MainBundleResource } from "doric";
import { colors, label } from "./utils";
import { img_base64 } from "./image_base64";
@@ -6,6 +6,7 @@ const imageUrl = 'https://img.zcool.cn/community/01e75b5da933daa801209e1ffa4649.
import logo from "./images/logo_w.png"
import button from "./images/button.png"
import { DrawableResource } from "doric/lib/src/util/resource";
@Entry
class ImageDemo extends Panel {
@@ -26,157 +27,156 @@ class ImageDemo extends Panel {
label('Button'),
image({
imageBase64: button,
scaleType: ScaleType.ScaleToFill,
layoutConfig: {
widthSpec: LayoutSpec.FIT,
heightSpec: LayoutSpec.FIT,
},
imageScale: 2,
image: Environment.platform === 'Android'
? new DrawableResource("doric_icon_back")
: new MainBundleResource("Hanabi.ttf"),
}),
image({
imageBase64: button,
image: new RemoteResource("https://p.upyun.com/demo/webp/webp/jpg-0.webp"),
}),
image({
image: new Base64Resource(img_base64[0]),
scaleType: ScaleType.ScaleToFill,
layoutConfig: {
widthSpec: LayoutSpec.FIT,
heightSpec: LayoutSpec.FIT,
},
}),
image({
imageBase64: button,
scaleType: ScaleType.ScaleToFill,
layoutConfig: {
widthSpec: LayoutSpec.JUST,
heightSpec: LayoutSpec.JUST,
},
width: 200,
height: 150 / 2.75,
stretchInset: {
left: 100,
top: 0,
right: 100,
bottom: 0
},
imageScale: 2.75,
}),
image({
imageBase64: button,
scaleType: ScaleType.ScaleToFill,
layoutConfig: {
widthSpec: LayoutSpec.JUST,
heightSpec: LayoutSpec.JUST,
},
width: 200,
height: 75,
stretchInset: {
left: 100,
top: 0,
right: 100,
bottom: 0
},
imageScale: 2,
// image({
// imageBase64: button,
// scaleType: ScaleType.ScaleToFill,
// layoutConfig: {
// widthSpec: LayoutSpec.JUST,
// heightSpec: LayoutSpec.JUST,
// },
// width: 200,
// height: 150 / 2.75,
// stretchInset: {
// left: 100,
// top: 0,
// right: 100,
// bottom: 0
// },
// imageScale: 2.75,
// }),
// image({
// imageBase64: button,
// scaleType: ScaleType.ScaleToFill,
// layoutConfig: {
// widthSpec: LayoutSpec.JUST,
// heightSpec: LayoutSpec.JUST,
// },
// width: 200,
// height: 75,
// stretchInset: {
// left: 100,
// top: 0,
// right: 100,
// bottom: 0
// },
// imageScale: 2,
}),
label('Gif '),
image({
imageUrl: "https://www.w3.org/People/mimasa/test/imgformat/img/w3c_home_animation.gif",
scaleType: ScaleType.ScaleToFill,
imageScale: 3,
}),
label('APNG'),
image({
imageUrl: "https://upload.wikimedia.org/wikipedia/commons/1/14/Animated_PNG_example_bouncing_beach_ball.png",
}),
label('Animated WebP'),
image({
imageUrl: "https://p.upyun.com/demo/webp/webp/animated-gif-0.webp",
// }),
// label('Gif '),
// image({
// imageUrl: "https://www.w3.org/People/mimasa/test/imgformat/img/w3c_home_animation.gif",
// scaleType: ScaleType.ScaleToFill,
// imageScale: 3,
// }),
// label('APNG'),
// image({
// imageUrl: "https://upload.wikimedia.org/wikipedia/commons/1/14/Animated_PNG_example_bouncing_beach_ball.png",
// }),
// label('Animated WebP'),
// image({
// imageUrl: "https://p.upyun.com/demo/webp/webp/animated-gif-0.webp",
}),
label('WebP'),
imageView = image({
imageUrl: "https://p.upyun.com/demo/webp/webp/jpg-0.webp",
layoutConfig: layoutConfig().just(),
width: 200,
height: 200,
loadCallback: (ret) => {
if (ret) {
imageView.width = ret.width
imageView.height = ret.height
}
}
}),
label('ScaleToFill'),
image({
imageUrl,
width: 300,
height: 300,
isBlur: true,
border: {
width: 2,
color: Color.GRAY,
},
scaleType: ScaleType.ScaleToFill,
layoutConfig: layoutConfig().just(),
loadCallback: (ret) => {
}
}),
label('ScaleAspectFit'),
image({
imageUrl,
width: 300,
height: 300,
border: {
width: 2,
color: Color.GRAY,
},
scaleType: ScaleType.ScaleAspectFit,
layoutConfig: layoutConfig().just(),
}),
label('ScaleAspectFill'),
image({
imageUrl,
width: 300,
height: 300,
border: {
width: 2,
color: Color.GRAY,
},
scaleType: ScaleType.ScaleAspectFill,
layoutConfig: layoutConfig().just(),
}),
label('ImageBase64'),
image({
imageBase64: img_base64[0],
width: 300,
height: 300,
border: {
width: 2,
color: Color.GRAY,
},
scaleType: ScaleType.ScaleAspectFill,
layoutConfig: layoutConfig().just(),
}),
label('StretchInset'),
image({
imageBase64: img_base64[1],
height: 60,
width: 134,
scaleType: ScaleType.ScaleAspectFill,
layoutConfig: layoutConfig().just(),
}),
image({
imageBase64: img_base64[1],
height: 60,
width: 294,
scaleType: ScaleType.ScaleToFill,
layoutConfig: layoutConfig().just(),
stretchInset: {
left: 0.85,
top: 0,
right: 0.149,
bottom: 0
}
}),
// }),
// label('WebP'),
// imageView = image({
// imageUrl: "https://p.upyun.com/demo/webp/webp/jpg-0.webp",
// layoutConfig: layoutConfig().just(),
// width: 200,
// height: 200,
// loadCallback: (ret) => {
// if (ret) {
// imageView.width = ret.width
// imageView.height = ret.height
// }
// }
// }),
// label('ScaleToFill'),
// image({
// imageUrl,
// width: 300,
// height: 300,
// isBlur: true,
// border: {
// width: 2,
// color: Color.GRAY,
// },
// scaleType: ScaleType.ScaleToFill,
// layoutConfig: layoutConfig().just(),
// loadCallback: (ret) => {
// }
// }),
// label('ScaleAspectFit'),
// image({
// imageUrl,
// width: 300,
// height: 300,
// border: {
// width: 2,
// color: Color.GRAY,
// },
// scaleType: ScaleType.ScaleAspectFit,
// layoutConfig: layoutConfig().just(),
// }),
// label('ScaleAspectFill'),
// image({
// imageUrl,
// width: 300,
// height: 300,
// border: {
// width: 2,
// color: Color.GRAY,
// },
// scaleType: ScaleType.ScaleAspectFill,
// layoutConfig: layoutConfig().just(),
// }),
// label('ImageBase64'),
// image({
// imageBase64: img_base64[0],
// width: 300,
// height: 300,
// border: {
// width: 2,
// color: Color.GRAY,
// },
// scaleType: ScaleType.ScaleAspectFill,
// layoutConfig: layoutConfig().just(),
// }),
// label('StretchInset'),
// image({
// imageBase64: img_base64[1],
// height: 60,
// width: 134,
// scaleType: ScaleType.ScaleAspectFill,
// layoutConfig: layoutConfig().just(),
// }),
// image({
// imageBase64: img_base64[1],
// height: 60,
// width: 294,
// scaleType: ScaleType.ScaleToFill,
// layoutConfig: layoutConfig().just(),
// stretchInset: {
// left: 0.85,
// top: 0,
// right: 0.149,
// bottom: 0
// }
// }),
],
{
layoutConfig: layoutConfig().most().configHeight(LayoutSpec.FIT),