本文整理汇总了TypeScript中bobril.sprite函数的典型用法代码示例。如果您正苦于以下问题：TypeScript sprite函数的具体用法？TypeScript sprite怎么用？TypeScript sprite使用的例子？那么, 这里精选的函数代码示例或许可以为您提供帮助。
在下文中一共展示了sprite函数的3个代码示例，这些例子默认根据受欢迎程度排序。您可以为喜欢或者感觉有用的代码点赞，您的评价将有助于系统推荐出更棒的TypeScript代码示例。
示例1: onChange
import * as b from 'bobril';
const iconShine = b.sprite("light.png", "#80ff80");
const iconOff = b.sprite("light.png", "#e03030");
export interface IData {
value: boolean;
onChange(value: boolean);
}
interface ICtx extends b.IBobrilCtx {
data: IData;
}
export default b.createComponent<IData>({
render(ctx: ICtx, me: b.IBobrilNode) {
b.style(me, ctx.data.value ? iconShine : iconOff);
},
onClick(ctx: ICtx): boolean {
ctx.data.onChange(!ctx.data.value);
return true;
}
});
示例2: initG
import * as b from 'bobril';
import { t, initGlobalization as initG } from 'bobril-g11n';
initG({
defaultLocale: 'cs-CZ',
pathToTranslation: (locale: string) => { return locale+'.js'; }
});
const bobrilLogo = b.styleDef([{ display: 'inline-block' }, b.sprite('logo.png')]);
interface IHeaderData {
fontSize: number;
children?: b.IBobrilChildren;
}
interface IHeaderCtx extends b.IBobrilCtx {
data: IHeaderData;
}
const header = b.createComponent({
render(ctx: IHeaderCtx, me: b.IBobrilNode) {
me.children = [ b.styledDiv('', bobrilLogo), ' ', ctx.data.children ];
b.style(me, { fontSize: ctx.data.fontSize });
}
});
interface IWarnHeaderData extends IHeaderData {
isWarning?: boolean;
}
interface IWarnHeaderCtx extends b.IBobrilCtx {示例3: render
import * as b from 'bobril';
import * as c from 'bobril-build-override-const-lib-sample';
let color = "#123456";
const icon = b.sprite("light.png", c.cstr);
const iconDynamicColor = b.sprite("light.png", () => color);
setInterval(() => {
color = "#" + color.substr(2, 5) + color[1];
b.invalidateStyles();
}, 1000);
let page = b.createVirtualComponent({
render(ctx: any, me: b.IBobrilNode, oldMe?: b.IBobrilCacheNode): void {
me.children = [
b.style({
tag: 'div'
}, icon),
b.style({
tag: 'div'
}, iconDynamicColor),
{
tag: 'p',
children: "cstr: " + c.cstr + " dyn color: " + color
}
];
}
});
b.init(() => page({}));