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

iOS: resize image support tile mode.

Browse Source
This commit is contained in:
吴尚昆 2022-03-16 19:25:55 +08:00 committed by osborn
parent 66692316de
commit 77617df848
12 changed files with 3180 additions and 1685 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -179,6 +179,28 @@ class ImageDemo extends Panel {
bottom: 0
}
}),
label('tileInset'),
image({
imageBase64: img_base64[1],
height: 66,
width: 147,
scaleType: ScaleType.ScaleAspectFill,
layoutConfig: layoutConfig().just(),
}),
image({
imageBase64: img_base64[1],
height: 66 * 2,
width: 147 * 2,
backgroundColor: Color.CYAN,
scaleType: ScaleType.ScaleToFill,
layoutConfig: layoutConfig().just(),
tileInset: {
left: 0,
top: 0,
right: 83,
bottom: 0
}
}),
],
{
layoutConfig: layoutConfig().most().configHeight(LayoutSpec.FIT),

11
doric-iOS/Pod/Classes/Shader/DoricImageNode.m
View File

@ -84,6 +84,7 @@ @interface DoricImageNode ()
@property(nonatomic, strong) NSString *errorImageBase64;
@property(nonatomic, strong) UIVisualEffectView *blurEffectView;
@property(nonatomic, strong) NSDictionary *stretchInsetDic;
@property(nonatomic, strong) NSDictionary *tileInsetDic;
@property(nonatomic, assign) CGFloat imageScale;
@end
@ -556,6 +557,8 @@ - (void)blendView:(UIImageView *)view forPropName:(NSString *)name propValue:(id
}
} else if ([@"stretchInset" isEqualToString:name]) {
self.stretchInsetDic = (NSDictionary *) prop;
} else if ([@"tileInset" isEqualToString:name]) {
self.tileInsetDic = (NSDictionary *) prop;
} else if ([@"imageScale" isEqualToString:name]) {
//Do not need set
} else if ([@"onAnimationEnd" isEqualToString:name]) {
@ -668,6 +671,14 @@ - (void)afterBlended:(NSDictionary *)props {
CGFloat scale = self.imageScale;
UIImage *result = [self.view.image resizableImageWithCapInsets:UIEdgeInsetsMake(top / scale, left / scale, bottom / scale, right / scale) resizingMode:UIImageResizingModeStretch];
self.view.image = result;
} else if (self.tileInsetDic != nil) {
CGFloat left = [self.tileInsetDic[@"left"] floatValue];
CGFloat top = [self.tileInsetDic[@"top"] floatValue];
CGFloat right = [self.tileInsetDic[@"right"] floatValue];
CGFloat bottom = [self.tileInsetDic[@"bottom"] floatValue];
CGFloat scale = self.imageScale;
UIImage *result = [self.view.image resizableImageWithCapInsets:UIEdgeInsetsMake(top / scale, left / scale, bottom / scale, right / scale) resizingMode:UIImageResizingModeTile];
self.view.image = result;
}
}

46
doric-js/bundle/doric-lib.es5.js
View File

@ -68,7 +68,7 @@ var Mutable = /** @class */ (function () {
*/
var __uniqueId__ = 0;
function uniqueId(prefix) {
return "__" + prefix + "_" + __uniqueId__++ + "__";
return "__".concat(prefix, "_").concat(__uniqueId__++, "__");
}
function toString(message) {
@ -177,11 +177,11 @@ var __values$5 = (undefined && undefined.__values) || function(o) {
function Property(target, propKey) {
Object.defineProperty(target, propKey, {
get: function () {
return Reflect.get(this, "__prop__" + propKey, this);
return Reflect.get(this, "__prop__".concat(propKey), this);
},
set: function (v) {
var oldV = Reflect.get(this, "__prop__" + propKey, this);
Reflect.set(this, "__prop__" + propKey, v, this);
var oldV = Reflect.get(this, "__prop__".concat(propKey), this);
Reflect.set(this, "__prop__".concat(propKey), v, this);
if (oldV !== v) {
Reflect.apply(this.onPropertyChanged, this, [propKey, oldV, v]);
}
@ -191,11 +191,11 @@ function Property(target, propKey) {
function InconsistProperty(target, propKey) {
Object.defineProperty(target, propKey, {
get: function () {
return Reflect.get(this, "__prop__" + propKey, this);
return Reflect.get(this, "__prop__".concat(propKey), this);
},
set: function (v) {
var oldV = Reflect.get(this, "__prop__" + propKey, this);
Reflect.set(this, "__prop__" + propKey, v, this);
var oldV = Reflect.get(this, "__prop__".concat(propKey), this);
Reflect.set(this, "__prop__".concat(propKey), v, this);
Reflect.apply(this.onPropertyChanged, this, [propKey, oldV, v]);
},
});
@ -373,7 +373,7 @@ var View = /** @class */ (function () {
return Reflect.apply(f, this, argumentsList);
}
else {
loge("Cannot find callback:" + id + " for " + JSON.stringify(this.toModel()));
loge("Cannot find callback:".concat(id, " for ").concat(JSON.stringify(this.toModel())));
}
};
View.prototype.toModel = function () {
@ -714,7 +714,7 @@ var Group = /** @class */ (function (_super) {
this.addChild(e);
}
else {
loge("Not allowed to add " + typeof e);
loge("Not allowed to add ".concat(typeof e));
}
};
Object.defineProperty(Group.prototype, "innerElement", {
@ -1225,7 +1225,7 @@ var Panel = /** @class */ (function () {
var v = this.retrospectView(viewIds);
if (v === undefined) {
loge("Cannot find view for " + viewIds);
loge("Cannot find view for ".concat(viewIds));
}
else {
var argumentsList = [callbackId];
@ -1427,7 +1427,7 @@ var Color = /** @class */ (function () {
}
Color.parse = function (str) {
if (!str.startsWith("#")) {
throw new Error("Parse color error with " + str);
throw new Error("Parse color error with ".concat(str));
}
var val = parseInt(str.substr(1), 16);
if (str.length === 7) {
@ -1437,7 +1437,7 @@ var Color = /** @class */ (function () {
return new Color(val);
}
else {
throw new Error("Parse color error with " + str);
throw new Error("Parse color error with ".concat(str));
}
};
Color.safeParse = function (str, defVal) {
@ -2240,7 +2240,7 @@ var MainBundleResource = /** @class */ (function (_super) {
var BundleResource = /** @class */ (function (_super) {
__extends$f(BundleResource, _super);
function BundleResource(bundleName, fileName) {
return _super.call(this, "bundle", bundleName + "://" + fileName) || this;
return _super.call(this, "bundle", "".concat(bundleName, "://").concat(fileName)) || this;
}
return BundleResource;
}(iOSResource));
@ -2389,6 +2389,10 @@ var Image = /** @class */ (function (_super) {
Property,
__metadata$b("design:type", Object)
], Image.prototype, "stretchInset", void 0);
__decorate$b([
Property,
__metadata$b("design:type", Object)
], Image.prototype, "tileInset", void 0);
__decorate$b([
Property,
__metadata$b("design:type", Function)
@ -2522,7 +2526,7 @@ var List = /** @class */ (function (_super) {
List.prototype.getItem = function (itemIdx) {
var view = this.renderItem(itemIdx);
view.superview = this;
this.cachedViews.set("" + itemIdx, view);
this.cachedViews.set("".concat(itemIdx), view);
return view;
};
List.prototype.renderBunchedItems = function (start, length) {
@ -2656,7 +2660,7 @@ var Slider = /** @class */ (function (_super) {
Slider.prototype.getItem = function (itemIdx) {
var view = this.renderPage(itemIdx);
view.superview = this;
this.cachedViews.set("" + itemIdx, view);
this.cachedViews.set("".concat(itemIdx), view);
return view;
};
Slider.prototype.renderBunchedItems = function (start, length) {
@ -3020,7 +3024,7 @@ exports.jsx = void 0;
Reflect.set(e, "innerElement", children, e);
}
else {
throw new Error("Do not support " + constructor.name + " for " + children);
throw new Error("Do not support ".concat(constructor.name, " for ").concat(children));
}
}
return e;
@ -3138,7 +3142,7 @@ var FlowLayout = /** @class */ (function (_super) {
FlowLayout.prototype.getItem = function (itemIdx) {
var view = this.renderItem(itemIdx);
view.superview = this;
this.cachedViews.set("" + itemIdx, view);
this.cachedViews.set("".concat(itemIdx), view);
return view;
};
FlowLayout.prototype.renderBunchedItems = function (start, length) {
@ -3819,7 +3823,7 @@ function navbar(context) {
}
function internalScheme(context, panelClass) {
return "_internal_://export?class=" + encodeURIComponent(panelClass.name) + "&context=" + context.id;
return "_internal_://export?class=".concat(encodeURIComponent(panelClass.name), "&context=").concat(context.id);
}
function navigator(context) {
var moduleName = "navigator";
@ -3859,9 +3863,9 @@ function transformRequest(request) {
if (request.params !== undefined) {
var queryStrings = [];
for (var key in request.params) {
queryStrings.push(key + "=" + encodeURIComponent(request.params[key]));
queryStrings.push("".concat(key, "=").concat(encodeURIComponent(request.params[key])));
}
request.url = "" + request.url + (url.indexOf('?') >= 0 ? '&' : '?') + queryStrings.join('&');
request.url = "".concat(request.url).concat(url.indexOf('?') >= 0 ? '&' : '?').concat(queryStrings.join('&'));
}
if (typeof request.data === 'object') {
request.data = JSON.stringify(request.data);
@ -4137,7 +4141,7 @@ function animate(context) {
}
else {
return function (args) {
return Promise.reject("Cannot find panel in Context:" + context.id);
return Promise.reject("Cannot find panel in Context:".concat(context.id));
};
}
}

4
doric-js/bundle/doric-lib.js
View File

@ -1804,6 +1804,10 @@ __decorate$b([
Property,
__metadata$b("design:type", Object)
], Image.prototype, "stretchInset", void 0);
__decorate$b([
Property,
__metadata$b("design:type", Object)
], Image.prototype, "tileInset", void 0);
__decorate$b([
Property,
__metadata$b("design:type", Function)

4748
doric-js/bundle/doric-sandbox.es5.js
View File

File diff suppressed because it is too large Load Diff

4
doric-js/bundle/doric-vm.js
View File

@ -3332,6 +3332,10 @@ __decorate$b([
Property,
__metadata$b("design:type", Object)
], Image.prototype, "stretchInset", void 0);
__decorate$b([
Property,
__metadata$b("design:type", Object)
], Image.prototype, "tileInset", void 0);
__decorate$b([
Property,
__metadata$b("design:type", Function)

6
doric-js/index.d.ts vendored
View File

@ -702,6 +702,12 @@ declare module 'doric/lib/src/widget/image' {
right: number;
bottom: number;
};
tileInset?: {
left: number;
top: number;
right: number;
bottom: number;
};
/**
* Called if loaded image is animated and played end.
*/

6
doric-js/lib/src/widget/image.d.ts vendored
View File

@ -82,6 +82,12 @@ export declare class Image extends View {
right: number;
bottom: number;
};
tileInset?: {
left: number;
top: number;
right: number;
bottom: number;
};
/**
* Called if loaded image is animated and played end.
*/

4
doric-js/lib/src/widget/image.js
View File

@ -129,6 +129,10 @@ __decorate([
Property,
__metadata("design:type", Object)
], Image.prototype, "stretchInset", void 0);
__decorate([
Property,
__metadata("design:type", Object)
], Image.prototype, "tileInset", void 0);
__decorate([
Property,
__metadata("design:type", Function)

8
doric-js/src/widget/image.ts
View File

@ -120,6 +120,14 @@ export class Image extends View {
bottom: number
}
@Property
tileInset?: {
left: number,
top: number,
right: number,
bottom: number
}
/**
* Called if loaded image is animated and played end.
*/

4
doric-web/dist/index.js vendored
View File

@ -3406,6 +3406,10 @@ __decorate$b([
Property,
__metadata$b("design:type", Object)
], Image.prototype, "stretchInset", void 0);
__decorate$b([
Property,
__metadata$b("design:type", Object)
], Image.prototype, "tileInset", void 0);
__decorate$b([
Property,
__metadata$b("design:type", Function)

2
doric-web/dist/index.js.map vendored
View File

File diff suppressed because one or more lines are too long