Commit 13c30981 authored by limingzhe's avatar limingzhe

fix: 新UI

parent c48ab451
......@@ -46,6 +46,7 @@ cc.Class({
this.barBaseW = this.bar.width;
this.barSpr = this.bar.getComponent(cc.Sprite);
this.barSf = this.barSpr.spriteFrame;
this.barBtn = cc.find("barBtn", this.node);
this.setProgress(0);
},
......@@ -62,9 +63,18 @@ cc.Class({
rect.width = w;
this.bar.width = w;
this.barSpr.spriteFrame.setRect(rect);
this.setBarBtn(w);
}, 1);
},
setBarBtn(w) {
if (!this.barBtn) {
return;
}
this.barBtn.x = w;
},
// update (dt) {},
});
{
"ver": "2.3.5",
"uuid": "e47c7377-6024-4d80-bdaa-08f6128d6e09",
"type": "sprite",
"wrapMode": "clamp",
"filterMode": "bilinear",
"premultiplyAlpha": false,
"genMipmaps": false,
"packable": true,
"width": 1136,
"height": 22,
"platformSettings": {},
"subMetas": {
"bg_di": {
"ver": "1.0.4",
"uuid": "e8357659-1266-4376-88ef-a3121f71ee34",
"rawTextureUuid": "e47c7377-6024-4d80-bdaa-08f6128d6e09",
"trimType": "auto",
"trimThreshold": 1,
"rotated": false,
"offsetX": 0,
"offsetY": 0,
"trimX": 0,
"trimY": 0,
"width": 1136,
"height": 22,
"rawWidth": 1136,
"rawHeight": 22,
"borderTop": 0,
"borderBottom": 0,
"borderLeft": 0,
"borderRight": 0,
"subMetas": {}
}
}
}
\ No newline at end of file
{
"ver": "2.3.5",
"uuid": "4808ebb7-71dc-437e-94bb-b3bbc856c79b",
"type": "sprite",
"wrapMode": "clamp",
"filterMode": "bilinear",
"premultiplyAlpha": false,
"genMipmaps": false,
"packable": true,
"width": 1136,
"height": 22,
"platformSettings": {},
"subMetas": {
"bg_tiao": {
"ver": "1.0.4",
"uuid": "60a74a74-2d69-49e3-ba49-b1f31fb0f5a1",
"rawTextureUuid": "4808ebb7-71dc-437e-94bb-b3bbc856c79b",
"trimType": "auto",
"trimThreshold": 1,
"rotated": false,
"offsetX": 0,
"offsetY": 0,
"trimX": 0,
"trimY": 0,
"width": 1136,
"height": 22,
"rawWidth": 1136,
"rawHeight": 22,
"borderTop": 0,
"borderBottom": 0,
"borderLeft": 0,
"borderRight": 0,
"subMetas": {}
}
}
}
\ No newline at end of file
......@@ -81,22 +81,28 @@
"__id__": 14
},
{
"__id__": 21
"__id__": 24
},
{
"__id__": 23
"__id__": 27
},
{
"__id__": 30
},
{
"__id__": 33
}
],
"_active": true,
"_components": [
{
"__id__": 32
"__id__": 42
},
{
"__id__": 33
"__id__": 43
},
{
"__id__": 34
"__id__": 44
}
],
"_prefab": null,
......@@ -621,19 +627,22 @@
"_children": [
{
"__id__": 15
},
{
"__id__": 18
}
],
"_active": true,
"_components": [
{
"__id__": 18
"__id__": 21
},
{
"__id__": 19
"__id__": 22
}
],
"_prefab": {
"__id__": 20
"__id__": 23
},
"_opacity": 255,
"_color": {
......@@ -645,8 +654,8 @@
},
"_contentSize": {
"__type__": "cc.Size",
"width": 807,
"height": 16
"width": 1136,
"height": 22
},
"_anchorPoint": {
"__type__": "cc.Vec2",
......@@ -657,15 +666,15 @@
"__type__": "TypedArray",
"ctor": "Float64Array",
"array": [
-491.647,
-452.899,
-302.463,
0,
0,
0,
0,
1,
1,
1,
0.8,
0.8,
1
]
},
......@@ -709,8 +718,8 @@
},
"_contentSize": {
"__type__": "cc.Size",
"width": 807,
"height": 16
"width": 1136,
"height": 22
},
"_anchorPoint": {
"__type__": "cc.Vec2",
......@@ -762,7 +771,7 @@
"_srcBlendFactor": 770,
"_dstBlendFactor": 771,
"_spriteFrame": {
"__uuid__": "c43f093f-a7c5-42d5-bf56-778a3548a7c3"
"__uuid__": "60a74a74-2d69-49e3-ba49-b1f31fb0f5a1"
},
"_type": 0,
"_sizeMode": 0,
......@@ -789,6 +798,113 @@
"fileId": "7dOjkMYWpFQaM6/QbKkBy/",
"sync": false
},
{
"__type__": "cc.Node",
"_name": "barBtn",
"_objFlags": 0,
"_parent": {
"__id__": 14
},
"_children": [],
"_active": true,
"_components": [
{
"__id__": 19
}
],
"_prefab": {
"__id__": 20
},
"_opacity": 255,
"_color": {
"__type__": "cc.Color",
"r": 255,
"g": 255,
"b": 255,
"a": 255
},
"_contentSize": {
"__type__": "cc.Size",
"width": 35,
"height": 35
},
"_anchorPoint": {
"__type__": "cc.Vec2",
"x": 0.5,
"y": 0.5
},
"_trs": {
"__type__": "TypedArray",
"ctor": "Float64Array",
"array": [
0,
0,
0,
0,
0,
0,
1,
1,
1,
1
]
},
"_eulerAngles": {
"__type__": "cc.Vec3",
"x": 0,
"y": 0,
"z": 0
},
"_skewX": 0,
"_skewY": 0,
"_is3DNode": false,
"_groupIndex": 0,
"groupIndex": 0,
"_id": "eb2WFtS4hADJ+khc0SvbDg"
},
{
"__type__": "cc.Sprite",
"_name": "",
"_objFlags": 0,
"node": {
"__id__": 18
},
"_enabled": true,
"_materials": [
{
"__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
}
],
"_srcBlendFactor": 770,
"_dstBlendFactor": 771,
"_spriteFrame": {
"__uuid__": "726627f7-8e16-48da-9461-d69400adcd48"
},
"_type": 0,
"_sizeMode": 1,
"_fillType": 0,
"_fillCenter": {
"__type__": "cc.Vec2",
"x": 0,
"y": 0
},
"_fillStart": 0,
"_fillRange": 0,
"_isTrimmedMode": true,
"_atlas": null,
"_id": "783/hiX/1JYLw7x2vPiYK2"
},
{
"__type__": "cc.PrefabInfo",
"root": {
"__id__": 14
},
"asset": {
"__uuid__": "3d356c4d-cb23-4239-aa5f-8a913f420fa4"
},
"fileId": "1cci8TIwZGwbB1/MkMOp1M",
"sync": false
},
{
"__type__": "cc.Sprite",
"_name": "",
......@@ -805,7 +921,7 @@
"_srcBlendFactor": 770,
"_dstBlendFactor": 771,
"_spriteFrame": {
"__uuid__": "82ee3fa0-26e3-43e8-afca-8bbc978d88e4"
"__uuid__": "e8357659-1266-4376-88ef-a3121f71ee34"
},
"_type": 0,
"_sizeMode": 1,
......@@ -853,7 +969,10 @@
"_active": true,
"_components": [
{
"__id__": 22
"__id__": 25
},
{
"__id__": 26
}
],
"_prefab": null,
......@@ -879,8 +998,8 @@
"__type__": "TypedArray",
"ctor": "Float64Array",
"array": [
446.742,
-301.61,
460.4180000000001,
291.003,
0,
0,
0,
......@@ -909,7 +1028,7 @@
"_name": "",
"_objFlags": 0,
"node": {
"__id__": 21
"__id__": 24
},
"_enabled": true,
"_materials": [
......@@ -936,6 +1055,363 @@
"_atlas": null,
"_id": "88pvEFWgZJ35j0k8mZ2GAf"
},
{
"__type__": "cc.Widget",
"_name": "",
"_objFlags": 0,
"node": {
"__id__": 24
},
"_enabled": true,
"alignMode": 1,
"_target": null,
"_alignFlags": 33,
"_left": 0,
"_right": 106.58199999999994,
"_top": 33.497000000000014,
"_bottom": 0,
"_verticalCenter": 0,
"_horizontalCenter": 0,
"_isAbsLeft": true,
"_isAbsRight": true,
"_isAbsTop": true,
"_isAbsBottom": true,
"_isAbsHorizontalCenter": true,
"_isAbsVerticalCenter": true,
"_originalWidth": 0,
"_originalHeight": 0,
"_id": "36JqqPpRxIHbqt5KXXwWuq"
},
{
"__type__": "cc.Node",
"_name": "btn_play",
"_objFlags": 0,
"_parent": {
"__id__": 2
},
"_children": [],
"_active": true,
"_components": [
{
"__id__": 28
},
{
"__id__": 29
}
],
"_prefab": null,
"_opacity": 255,
"_color": {
"__type__": "cc.Color",
"r": 255,
"g": 255,
"b": 255,
"a": 255
},
"_contentSize": {
"__type__": "cc.Size",
"width": 90,
"height": 90
},
"_anchorPoint": {
"__type__": "cc.Vec2",
"x": 0.5,
"y": 0.5
},
"_trs": {
"__type__": "TypedArray",
"ctor": "Float64Array",
"array": [
-537.91,
-294.027,
0,
0,
0,
0,
1,
1,
1,
1
]
},
"_eulerAngles": {
"__type__": "cc.Vec3",
"x": 0,
"y": 0,
"z": 0
},
"_skewX": 0,
"_skewY": 0,
"_is3DNode": false,
"_groupIndex": 0,
"groupIndex": 0,
"_id": "e6tWffUNZKPbbkHAIfUV/D"
},
{
"__type__": "cc.Sprite",
"_name": "",
"_objFlags": 0,
"node": {
"__id__": 27
},
"_enabled": true,
"_materials": [
{
"__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
}
],
"_srcBlendFactor": 770,
"_dstBlendFactor": 771,
"_spriteFrame": {
"__uuid__": "fde96e9d-780a-4322-a13a-88a834e944d2"
},
"_type": 0,
"_sizeMode": 1,
"_fillType": 0,
"_fillCenter": {
"__type__": "cc.Vec2",
"x": 0,
"y": 0
},
"_fillStart": 0,
"_fillRange": 0,
"_isTrimmedMode": true,
"_atlas": null,
"_id": "84kDrZgPhCO7wBpSJ8u6mg"
},
{
"__type__": "cc.Button",
"_name": "",
"_objFlags": 0,
"node": {
"__id__": 27
},
"_enabled": true,
"_normalMaterial": null,
"_grayMaterial": null,
"duration": 0.1,
"zoomScale": 1.2,
"clickEvents": [],
"_N$interactable": true,
"_N$enableAutoGrayEffect": false,
"_N$transition": 0,
"transition": 0,
"_N$normalColor": {
"__type__": "cc.Color",
"r": 255,
"g": 255,
"b": 255,
"a": 255
},
"_N$pressedColor": {
"__type__": "cc.Color",
"r": 211,
"g": 211,
"b": 211,
"a": 255
},
"pressedColor": {
"__type__": "cc.Color",
"r": 211,
"g": 211,
"b": 211,
"a": 255
},
"_N$hoverColor": {
"__type__": "cc.Color",
"r": 255,
"g": 255,
"b": 255,
"a": 255
},
"hoverColor": {
"__type__": "cc.Color",
"r": 255,
"g": 255,
"b": 255,
"a": 255
},
"_N$disabledColor": {
"__type__": "cc.Color",
"r": 124,
"g": 124,
"b": 124,
"a": 255
},
"_N$normalSprite": null,
"_N$pressedSprite": null,
"pressedSprite": null,
"_N$hoverSprite": null,
"hoverSprite": null,
"_N$disabledSprite": null,
"_N$target": null,
"_id": "8e28hf/ZBAh4bxjmUcvsbT"
},
{
"__type__": "cc.Node",
"_name": "btn_pause",
"_objFlags": 0,
"_parent": {
"__id__": 2
},
"_children": [],
"_active": false,
"_components": [
{
"__id__": 31
},
{
"__id__": 32
}
],
"_prefab": null,
"_opacity": 255,
"_color": {
"__type__": "cc.Color",
"r": 255,
"g": 255,
"b": 255,
"a": 255
},
"_contentSize": {
"__type__": "cc.Size",
"width": 90,
"height": 90
},
"_anchorPoint": {
"__type__": "cc.Vec2",
"x": 0.5,
"y": 0.5
},
"_trs": {
"__type__": "TypedArray",
"ctor": "Float64Array",
"array": [
-537.91,
-294.027,
0,
0,
0,
0,
1,
1,
1,
1
]
},
"_eulerAngles": {
"__type__": "cc.Vec3",
"x": 0,
"y": 0,
"z": 0
},
"_skewX": 0,
"_skewY": 0,
"_is3DNode": false,
"_groupIndex": 0,
"groupIndex": 0,
"_id": "0fsliAbslErYT3ZJzjuy+M"
},
{
"__type__": "cc.Sprite",
"_name": "",
"_objFlags": 0,
"node": {
"__id__": 30
},
"_enabled": true,
"_materials": [
{
"__uuid__": "eca5d2f2-8ef6-41c2-bbe6-f9c79d09c432"
}
],
"_srcBlendFactor": 770,
"_dstBlendFactor": 771,
"_spriteFrame": {
"__uuid__": "b3f36e9c-7645-4a72-b831-b3456be17fc7"
},
"_type": 0,
"_sizeMode": 1,
"_fillType": 0,
"_fillCenter": {
"__type__": "cc.Vec2",
"x": 0,
"y": 0
},
"_fillStart": 0,
"_fillRange": 0,
"_isTrimmedMode": true,
"_atlas": null,
"_id": "3dcijaLNpMEaUzr112GWuW"
},
{
"__type__": "cc.Button",
"_name": "",
"_objFlags": 0,
"node": {
"__id__": 30
},
"_enabled": true,
"_normalMaterial": null,
"_grayMaterial": null,
"duration": 0.1,
"zoomScale": 1.2,
"clickEvents": [],
"_N$interactable": true,
"_N$enableAutoGrayEffect": false,
"_N$transition": 0,
"transition": 0,
"_N$normalColor": {
"__type__": "cc.Color",
"r": 255,
"g": 255,
"b": 255,
"a": 255
},
"_N$pressedColor": {
"__type__": "cc.Color",
"r": 211,
"g": 211,
"b": 211,
"a": 255
},
"pressedColor": {
"__type__": "cc.Color",
"r": 211,
"g": 211,
"b": 211,
"a": 255
},
"_N$hoverColor": {
"__type__": "cc.Color",
"r": 255,
"g": 255,
"b": 255,
"a": 255
},
"hoverColor": {
"__type__": "cc.Color",
"r": 255,
"g": 255,
"b": 255,
"a": 255
},
"_N$disabledColor": {
"__type__": "cc.Color",
"r": 124,
"g": 124,
"b": 124,
"a": 255
},
"_N$normalSprite": null,
"_N$pressedSprite": null,
"pressedSprite": null,
"_N$hoverSprite": null,
"hoverSprite": null,
"_N$disabledSprite": null,
"_N$target": null,
"_id": "56nzkoiQlHnIlVO3ZDJMq3"
},
{
"__type__": "cc.Node",
"_name": "res",
......@@ -945,10 +1421,10 @@
},
"_children": [
{
"__id__": 24
"__id__": 34
},
{
"__id__": 27
"__id__": 37
}
],
"_active": false,
......@@ -1006,11 +1482,11 @@
"_name": "font",
"_objFlags": 0,
"_parent": {
"__id__": 23
"__id__": 33
},
"_children": [
{
"__id__": 25
"__id__": 35
}
],
"_active": true,
......@@ -1068,13 +1544,13 @@
"_name": "BRLNSDB",
"_objFlags": 0,
"_parent": {
"__id__": 24
"__id__": 34
},
"_children": [],
"_active": true,
"_components": [
{
"__id__": 26
"__id__": 36
}
],
"_prefab": null,
......@@ -1130,7 +1606,7 @@
"_name": "",
"_objFlags": 0,
"node": {
"__id__": 25
"__id__": 35
},
"_enabled": true,
"_materials": [],
......@@ -1161,14 +1637,14 @@
"_name": "img",
"_objFlags": 0,
"_parent": {
"__id__": 23
"__id__": 33
},
"_children": [
{
"__id__": 28
"__id__": 38
},
{
"__id__": 30
"__id__": 40
}
],
"_active": true,
......@@ -1226,13 +1702,13 @@
"_name": "btn_right",
"_objFlags": 0,
"_parent": {
"__id__": 27
"__id__": 37
},
"_children": [],
"_active": true,
"_components": [
{
"__id__": 29
"__id__": 39
}
],
"_prefab": null,
......@@ -1288,7 +1764,7 @@
"_name": "",
"_objFlags": 0,
"node": {
"__id__": 28
"__id__": 38
},
"_enabled": true,
"_materials": [],
......@@ -1316,13 +1792,13 @@
"_name": "icon",
"_objFlags": 0,
"_parent": {
"__id__": 27
"__id__": 37
},
"_children": [],
"_active": true,
"_components": [
{
"__id__": 31
"__id__": 41
}
],
"_prefab": null,
......@@ -1378,7 +1854,7 @@
"_name": "",
"_objFlags": 0,
"node": {
"__id__": 30
"__id__": 40
},
"_enabled": true,
"_materials": [],
......
......@@ -48,22 +48,52 @@ export default class SceneComponent extends MyCocosSceneComponent {
// this.initIcon();
}
playBtn;
pauseBtn;
initBtn() {
const canvas = cc.find("Canvas");
const jumpBtn = cc.find("Canvas/btn_skip"); //this.getSprNode('btn_right');
jumpBtn.on('touchstart', () => {
this.videoPlayEnd();
})
// jumpBtn.parent = canvas;
// jumpBtn.anchorX = 1;
// jumpBtn.anchorY = 1;
// jumpBtn.x = canvas.width / 2;
// jumpBtn.y = canvas.height / 2;
const playBtn = cc.find('Canvas/btn_play');
playBtn.on('click', () => {
console.log(' in click 1')
this.video.play();
this.refreshBtnState();
})
playBtn.zIndex = 10;
this.playBtn = playBtn;
this.playBtn.active = false;
const pauseBtn = cc.find('Canvas/btn_pause');
pauseBtn.on('click', () => {
console.log(' in click 2')
this.video.pause();
this.refreshBtnState();
})
pauseBtn.zIndex = 10;
this.pauseBtn = pauseBtn;
this.pauseBtn.active = false;
}
async refreshBtnState() {
await asyncDelay(0.01);
if (this.video.isPlaying()) {
this.pauseBtn.active = true;
this.playBtn.active = false;
} else {
this.pauseBtn.active = false;
this.playBtn.active = true;
}
}
......@@ -152,7 +182,9 @@ export default class SceneComponent extends MyCocosSceneComponent {
// return;
// }
video.play();
checkIsPlaying();
this.refreshBtnState();
// checkIsPlaying();
})
const checkIsPlaying = () => {
......@@ -227,7 +259,8 @@ export default class SceneComponent extends MyCocosSceneComponent {
// return;
// }
video.play();
checkIsPlaying();
this.refreshBtnState();
// checkIsPlaying();
})
const checkIsPlaying = () => {
......@@ -450,9 +483,9 @@ export default class SceneComponent extends MyCocosSceneComponent {
percent = percent < 0 ? 0 : percent;
percent = percent > 1 ? 1 : percent;
console.log('this.video.currentTime: ', this.video.currentTime);
console.log('this.video.getDuration(): ', this.video.getDuration());
console.log('percent: ', percent);
// console.log('this.video.currentTime: ', this.video.currentTime);
// console.log('this.video.getDuration(): ', this.video.getDuration());
// console.log('percent: ', percent);
this.progressJs.setProgress(percent);
}
}
......
{
"ver": "2.3.5",
"uuid": "c1e47358-d474-4fa5-bc0c-c0fe545374fc",
"type": "sprite",
"wrapMode": "clamp",
"filterMode": "bilinear",
"premultiplyAlpha": false,
"genMipmaps": false,
"packable": true,
"width": 90,
"height": 90,
"platformSettings": {},
"subMetas": {
"btn_play": {
"ver": "1.0.4",
"uuid": "b3f36e9c-7645-4a72-b831-b3456be17fc7",
"rawTextureUuid": "c1e47358-d474-4fa5-bc0c-c0fe545374fc",
"trimType": "auto",
"trimThreshold": 1,
"rotated": false,
"offsetX": 0,
"offsetY": 0,
"trimX": 0,
"trimY": 0,
"width": 90,
"height": 90,
"rawWidth": 90,
"rawHeight": 90,
"borderTop": 0,
"borderBottom": 0,
"borderLeft": 0,
"borderRight": 0,
"subMetas": {}
}
}
}
\ No newline at end of file
{
"ver": "2.3.5",
"uuid": "9134e709-56e6-4504-ad19-a7b5ef3f7519",
"type": "sprite",
"wrapMode": "clamp",
"filterMode": "bilinear",
"premultiplyAlpha": false,
"genMipmaps": false,
"packable": true,
"width": 90,
"height": 90,
"platformSettings": {},
"subMetas": {
"btn_stop": {
"ver": "1.0.4",
"uuid": "fde96e9d-780a-4322-a13a-88a834e944d2",
"rawTextureUuid": "9134e709-56e6-4504-ad19-a7b5ef3f7519",
"trimType": "auto",
"trimThreshold": 1,
"rotated": false,
"offsetX": 0,
"offsetY": 0,
"trimX": 0,
"trimY": 0,
"width": 90,
"height": 90,
"rawWidth": 90,
"rawHeight": 90,
"borderTop": 0,
"borderBottom": 0,
"borderLeft": 0,
"borderRight": 0,
"subMetas": {}
}
}
}
\ No newline at end of file
{
"ver": "2.3.5",
"uuid": "da9aa884-5886-4107-89c8-e87509b435bd",
"type": "sprite",
"wrapMode": "clamp",
"filterMode": "bilinear",
"premultiplyAlpha": false,
"genMipmaps": false,
"packable": true,
"width": 35,
"height": 35,
"platformSettings": {},
"subMetas": {
"icon_point": {
"ver": "1.0.4",
"uuid": "726627f7-8e16-48da-9461-d69400adcd48",
"rawTextureUuid": "da9aa884-5886-4107-89c8-e87509b435bd",
"trimType": "auto",
"trimThreshold": 1,
"rotated": false,
"offsetX": 0,
"offsetY": 0,
"trimX": 0,
"trimY": 0,
"width": 35,
"height": 35,
"rawWidth": 35,
"rawHeight": 35,
"borderTop": 0,
"borderBottom": 0,
"borderLeft": 0,
"borderRight": 0,
"subMetas": {}
}
}
}
\ No newline at end of file
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment