增加大图轮播
This commit is contained in:
zhl
parent
17c2df2b0e
commit
8385225c5d
@ -27,17 +27,23 @@
|
||||
},
|
||||
{
|
||||
"__id__": 11
|
||||
},
|
||||
{
|
||||
"__id__": 15
|
||||
},
|
||||
{
|
||||
"__id__": 19
|
||||
}
|
||||
],
|
||||
"_active": true,
|
||||
"_level": 1,
|
||||
"_components": [
|
||||
{
|
||||
"__id__": 17
|
||||
"__id__": 25
|
||||
}
|
||||
],
|
||||
"_prefab": {
|
||||
"__id__": 18
|
||||
"__id__": 26
|
||||
},
|
||||
"_opacity": 255,
|
||||
"_color": {
|
||||
@ -186,6 +192,210 @@
|
||||
"fileId": "3206pHeSJH25Pu5zTD4rJo",
|
||||
"sync": false
|
||||
},
|
||||
{
|
||||
"__type__": "cc.Node",
|
||||
"_name": "001",
|
||||
"_objFlags": 0,
|
||||
"_parent": {
|
||||
"__id__": 1
|
||||
},
|
||||
"_children": [],
|
||||
"_active": true,
|
||||
"_level": 2,
|
||||
"_components": [
|
||||
{
|
||||
"__id__": 6
|
||||
}
|
||||
],
|
||||
"_prefab": {
|
||||
"__id__": 7
|
||||
},
|
||||
"_opacity": 255,
|
||||
"_color": {
|
||||
"__type__": "cc.Color",
|
||||
"r": 255,
|
||||
"g": 255,
|
||||
"b": 255,
|
||||
"a": 255
|
||||
},
|
||||
"_contentSize": {
|
||||
"__type__": "cc.Size",
|
||||
"width": 750,
|
||||
"height": 1161
|
||||
},
|
||||
"_anchorPoint": {
|
||||
"__type__": "cc.Vec2",
|
||||
"x": 0.5,
|
||||
"y": 0.5
|
||||
},
|
||||
"_position": {
|
||||
"__type__": "cc.Vec3",
|
||||
"x": -750,
|
||||
"y": 13,
|
||||
"z": 0
|
||||
},
|
||||
"_scale": {
|
||||
"__type__": "cc.Vec3",
|
||||
"x": 1,
|
||||
"y": 1,
|
||||
"z": 1
|
||||
},
|
||||
"_rotationX": 0,
|
||||
"_rotationY": 0,
|
||||
"_quat": {
|
||||
"__type__": "cc.Quat",
|
||||
"x": 0,
|
||||
"y": 0,
|
||||
"z": 0,
|
||||
"w": 1
|
||||
},
|
||||
"_skewX": 0,
|
||||
"_skewY": 0,
|
||||
"_zIndex": 0,
|
||||
"groupIndex": 0,
|
||||
"_id": ""
|
||||
},
|
||||
{
|
||||
"__type__": "cc.Sprite",
|
||||
"_name": "",
|
||||
"_objFlags": 0,
|
||||
"node": {
|
||||
"__id__": 5
|
||||
},
|
||||
"_enabled": true,
|
||||
"_srcBlendFactor": 770,
|
||||
"_dstBlendFactor": 771,
|
||||
"_spriteFrame": {
|
||||
"__uuid__": "4fb115d2-58e4-4b9b-badd-a26ca28a7f78"
|
||||
},
|
||||
"_type": 0,
|
||||
"_sizeMode": 0,
|
||||
"_fillType": 0,
|
||||
"_fillCenter": {
|
||||
"__type__": "cc.Vec2",
|
||||
"x": 0,
|
||||
"y": 0
|
||||
},
|
||||
"_fillStart": 0,
|
||||
"_fillRange": 0,
|
||||
"_isTrimmedMode": true,
|
||||
"_state": 0,
|
||||
"_atlas": null,
|
||||
"_id": ""
|
||||
},
|
||||
{
|
||||
"__type__": "cc.PrefabInfo",
|
||||
"root": {
|
||||
"__id__": 1
|
||||
},
|
||||
"asset": {
|
||||
"__uuid__": "9c00729f-1f46-4905-a9e1-bc0e74feb37c"
|
||||
},
|
||||
"fileId": "85E5UZo7hNDIacG5+ORmsl",
|
||||
"sync": false
|
||||
},
|
||||
{
|
||||
"__type__": "cc.Node",
|
||||
"_name": "003",
|
||||
"_objFlags": 0,
|
||||
"_parent": {
|
||||
"__id__": 1
|
||||
},
|
||||
"_children": [],
|
||||
"_active": true,
|
||||
"_level": 2,
|
||||
"_components": [
|
||||
{
|
||||
"__id__": 9
|
||||
}
|
||||
],
|
||||
"_prefab": {
|
||||
"__id__": 10
|
||||
},
|
||||
"_opacity": 255,
|
||||
"_color": {
|
||||
"__type__": "cc.Color",
|
||||
"r": 255,
|
||||
"g": 255,
|
||||
"b": 255,
|
||||
"a": 255
|
||||
},
|
||||
"_contentSize": {
|
||||
"__type__": "cc.Size",
|
||||
"width": 750,
|
||||
"height": 1161
|
||||
},
|
||||
"_anchorPoint": {
|
||||
"__type__": "cc.Vec2",
|
||||
"x": 0.5,
|
||||
"y": 0.5
|
||||
},
|
||||
"_position": {
|
||||
"__type__": "cc.Vec3",
|
||||
"x": 750,
|
||||
"y": 13,
|
||||
"z": 0
|
||||
},
|
||||
"_scale": {
|
||||
"__type__": "cc.Vec3",
|
||||
"x": 1,
|
||||
"y": 1,
|
||||
"z": 1
|
||||
},
|
||||
"_rotationX": 0,
|
||||
"_rotationY": 0,
|
||||
"_quat": {
|
||||
"__type__": "cc.Quat",
|
||||
"x": 0,
|
||||
"y": 0,
|
||||
"z": 0,
|
||||
"w": 1
|
||||
},
|
||||
"_skewX": 0,
|
||||
"_skewY": 0,
|
||||
"_zIndex": 0,
|
||||
"groupIndex": 0,
|
||||
"_id": ""
|
||||
},
|
||||
{
|
||||
"__type__": "cc.Sprite",
|
||||
"_name": "",
|
||||
"_objFlags": 0,
|
||||
"node": {
|
||||
"__id__": 8
|
||||
},
|
||||
"_enabled": true,
|
||||
"_srcBlendFactor": 770,
|
||||
"_dstBlendFactor": 771,
|
||||
"_spriteFrame": {
|
||||
"__uuid__": "fcbed040-f45d-4fe3-8c6a-1dadd55aee22"
|
||||
},
|
||||
"_type": 0,
|
||||
"_sizeMode": 0,
|
||||
"_fillType": 0,
|
||||
"_fillCenter": {
|
||||
"__type__": "cc.Vec2",
|
||||
"x": 0,
|
||||
"y": 0
|
||||
},
|
||||
"_fillStart": 0,
|
||||
"_fillRange": 0,
|
||||
"_isTrimmedMode": true,
|
||||
"_state": 0,
|
||||
"_atlas": null,
|
||||
"_id": ""
|
||||
},
|
||||
{
|
||||
"__type__": "cc.PrefabInfo",
|
||||
"root": {
|
||||
"__id__": 1
|
||||
},
|
||||
"asset": {
|
||||
"__uuid__": "9c00729f-1f46-4905-a9e1-bc0e74feb37c"
|
||||
},
|
||||
"fileId": "83Q8Za8eFB8rdVssFCys9w",
|
||||
"sync": false
|
||||
},
|
||||
{
|
||||
"__type__": "cc.Node",
|
||||
"_name": "arrow_right",
|
||||
@ -198,11 +408,14 @@
|
||||
"_level": 4,
|
||||
"_components": [
|
||||
{
|
||||
"__id__": 6
|
||||
"__id__": 12
|
||||
},
|
||||
{
|
||||
"__id__": 13
|
||||
}
|
||||
],
|
||||
"_prefab": {
|
||||
"__id__": 7
|
||||
"__id__": 14
|
||||
},
|
||||
"_opacity": 255,
|
||||
"_color": {
|
||||
@ -254,7 +467,7 @@
|
||||
"_name": "",
|
||||
"_objFlags": 0,
|
||||
"node": {
|
||||
"__id__": 5
|
||||
"__id__": 11
|
||||
},
|
||||
"_enabled": true,
|
||||
"_srcBlendFactor": 770,
|
||||
@ -277,6 +490,59 @@
|
||||
"_atlas": null,
|
||||
"_id": ""
|
||||
},
|
||||
{
|
||||
"__type__": "cc.Button",
|
||||
"_name": "",
|
||||
"_objFlags": 0,
|
||||
"node": {
|
||||
"__id__": 11
|
||||
},
|
||||
"_enabled": true,
|
||||
"transition": 0,
|
||||
"pressedColor": {
|
||||
"__type__": "cc.Color",
|
||||
"r": 211,
|
||||
"g": 211,
|
||||
"b": 211,
|
||||
"a": 255
|
||||
},
|
||||
"hoverColor": {
|
||||
"__type__": "cc.Color",
|
||||
"r": 255,
|
||||
"g": 255,
|
||||
"b": 255,
|
||||
"a": 255
|
||||
},
|
||||
"duration": 0.1,
|
||||
"zoomScale": 1.2,
|
||||
"clickEvents": [],
|
||||
"_N$interactable": true,
|
||||
"_N$enableAutoGrayEffect": false,
|
||||
"_N$normalColor": {
|
||||
"__type__": "cc.Color",
|
||||
"r": 214,
|
||||
"g": 214,
|
||||
"b": 214,
|
||||
"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": {
|
||||
"__id__": 11
|
||||
},
|
||||
"_id": ""
|
||||
},
|
||||
{
|
||||
"__type__": "cc.PrefabInfo",
|
||||
"root": {
|
||||
@ -300,11 +566,14 @@
|
||||
"_level": 4,
|
||||
"_components": [
|
||||
{
|
||||
"__id__": 9
|
||||
"__id__": 16
|
||||
},
|
||||
{
|
||||
"__id__": 17
|
||||
}
|
||||
],
|
||||
"_prefab": {
|
||||
"__id__": 10
|
||||
"__id__": 18
|
||||
},
|
||||
"_opacity": 255,
|
||||
"_color": {
|
||||
@ -356,7 +625,7 @@
|
||||
"_name": "",
|
||||
"_objFlags": 0,
|
||||
"node": {
|
||||
"__id__": 8
|
||||
"__id__": 15
|
||||
},
|
||||
"_enabled": true,
|
||||
"_srcBlendFactor": 770,
|
||||
@ -379,6 +648,59 @@
|
||||
"_atlas": null,
|
||||
"_id": ""
|
||||
},
|
||||
{
|
||||
"__type__": "cc.Button",
|
||||
"_name": "",
|
||||
"_objFlags": 0,
|
||||
"node": {
|
||||
"__id__": 15
|
||||
},
|
||||
"_enabled": true,
|
||||
"transition": 0,
|
||||
"pressedColor": {
|
||||
"__type__": "cc.Color",
|
||||
"r": 211,
|
||||
"g": 211,
|
||||
"b": 211,
|
||||
"a": 255
|
||||
},
|
||||
"hoverColor": {
|
||||
"__type__": "cc.Color",
|
||||
"r": 255,
|
||||
"g": 255,
|
||||
"b": 255,
|
||||
"a": 255
|
||||
},
|
||||
"duration": 0.1,
|
||||
"zoomScale": 1.2,
|
||||
"clickEvents": [],
|
||||
"_N$interactable": true,
|
||||
"_N$enableAutoGrayEffect": false,
|
||||
"_N$normalColor": {
|
||||
"__type__": "cc.Color",
|
||||
"r": 214,
|
||||
"g": 214,
|
||||
"b": 214,
|
||||
"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": {
|
||||
"__id__": 15
|
||||
},
|
||||
"_id": ""
|
||||
},
|
||||
{
|
||||
"__type__": "cc.PrefabInfo",
|
||||
"root": {
|
||||
@ -399,18 +721,18 @@
|
||||
},
|
||||
"_children": [
|
||||
{
|
||||
"__id__": 12
|
||||
"__id__": 20
|
||||
}
|
||||
],
|
||||
"_active": true,
|
||||
"_level": 4,
|
||||
"_components": [
|
||||
{
|
||||
"__id__": 15
|
||||
"__id__": 23
|
||||
}
|
||||
],
|
||||
"_prefab": {
|
||||
"__id__": 16
|
||||
"__id__": 24
|
||||
},
|
||||
"_opacity": 255,
|
||||
"_color": {
|
||||
@ -462,18 +784,18 @@
|
||||
"_name": "btn_title_4",
|
||||
"_objFlags": 0,
|
||||
"_parent": {
|
||||
"__id__": 11
|
||||
"__id__": 19
|
||||
},
|
||||
"_children": [],
|
||||
"_active": true,
|
||||
"_level": 4,
|
||||
"_components": [
|
||||
{
|
||||
"__id__": 13
|
||||
"__id__": 21
|
||||
}
|
||||
],
|
||||
"_prefab": {
|
||||
"__id__": 14
|
||||
"__id__": 22
|
||||
},
|
||||
"_opacity": 255,
|
||||
"_color": {
|
||||
@ -525,7 +847,7 @@
|
||||
"_name": "",
|
||||
"_objFlags": 0,
|
||||
"node": {
|
||||
"__id__": 12
|
||||
"__id__": 20
|
||||
},
|
||||
"_enabled": true,
|
||||
"_srcBlendFactor": 770,
|
||||
@ -564,7 +886,7 @@
|
||||
"_name": "",
|
||||
"_objFlags": 0,
|
||||
"node": {
|
||||
"__id__": 11
|
||||
"__id__": 19
|
||||
},
|
||||
"_enabled": true,
|
||||
"_srcBlendFactor": 770,
|
||||
@ -606,6 +928,22 @@
|
||||
"__id__": 1
|
||||
},
|
||||
"_enabled": true,
|
||||
"leftBtn": {
|
||||
"__id__": 15
|
||||
},
|
||||
"rightBtn": {
|
||||
"__id__": 11
|
||||
},
|
||||
"currentNode": {
|
||||
"__id__": 2
|
||||
},
|
||||
"leftNode": {
|
||||
"__id__": 5
|
||||
},
|
||||
"rightNode": {
|
||||
"__id__": 8
|
||||
},
|
||||
"currentIdx": 2,
|
||||
"_id": ""
|
||||
},
|
||||
{
|
||||
|
||||
@ -2,17 +2,98 @@ cc.Class({
|
||||
extends: cc.Component,
|
||||
|
||||
properties: {
|
||||
|
||||
leftBtn: {
|
||||
default: null,
|
||||
type: cc.Node
|
||||
},
|
||||
rightBtn: {
|
||||
default: null,
|
||||
type: cc.Node
|
||||
},
|
||||
currentNode: {
|
||||
default: null,
|
||||
type: cc.Node
|
||||
},
|
||||
leftNode: {
|
||||
default: null,
|
||||
type: cc.Node
|
||||
},
|
||||
rightNode: {
|
||||
default: null,
|
||||
type: cc.Node
|
||||
},
|
||||
currentIdx: 2,
|
||||
scrolling: false
|
||||
},
|
||||
|
||||
// LIFE-CYCLE CALLBACKS:
|
||||
|
||||
onLoad () {
|
||||
|
||||
onLoad() {
|
||||
let self = this;
|
||||
this.leftBtn.on('click', () => {
|
||||
if (!self.scrolling) {
|
||||
self.scrolling = true;
|
||||
this.moveLeft();
|
||||
}
|
||||
});
|
||||
this.rightBtn.on('click', () => {
|
||||
if (!self.scrolling) {
|
||||
self.scrolling = true;
|
||||
self.moveRight();
|
||||
}
|
||||
})
|
||||
},
|
||||
|
||||
start () {
|
||||
start() {
|
||||
},
|
||||
|
||||
// update (dt) {},
|
||||
moveLeft: function () {
|
||||
let self = this;
|
||||
let moveFinish = cc.callFunc(function () {
|
||||
self.currentIdx ++;
|
||||
if (self.currentIdx > 4) {
|
||||
self.currentIdx = 0;
|
||||
}
|
||||
let nextIdx = self.currentIdx === 4 ? 0 : self.currentIdx + 1;
|
||||
let tmp = self.leftNode;
|
||||
self.leftNode = self.currentNode;
|
||||
self.currentNode = self.rightNode;
|
||||
self.rightNode = tmp;
|
||||
let url = 'textures/part4/00' + nextIdx;
|
||||
cc.loader.loadRes(url, cc.SpriteFrame, function (err, spriteFrame) {
|
||||
self.rightNode.getComponent(cc.Sprite).spriteFrame = spriteFrame;
|
||||
});
|
||||
self.scrolling = false;
|
||||
}, this, {});
|
||||
let moveCurrent = cc.moveTo(0.5, -750, 13);
|
||||
var seq = cc.sequence(moveCurrent, moveFinish);
|
||||
self.currentNode.runAction(seq);
|
||||
self.rightNode.runAction(cc.moveTo(0.5, 0, 13));
|
||||
self.leftNode.position = cc.v2(750, 13);
|
||||
},
|
||||
moveRight: function () {
|
||||
let self = this;
|
||||
let moveFinish = cc.callFunc(function () {
|
||||
self.currentIdx --;
|
||||
if (self.currentIdx < 0) {
|
||||
self.currentIdx = 4;
|
||||
}
|
||||
let nextIdx = self.currentIdx === 0 ? 4 : self.currentIdx - 1;
|
||||
self.rightNode.position = cc.v2(-750, 13);
|
||||
let tmp = self.rightNode;
|
||||
self.rightNode = self.currentNode;
|
||||
self.currentNode = self.leftNode;
|
||||
self.leftNode = tmp;
|
||||
let url = 'textures/part4/00' + nextIdx;
|
||||
cc.loader.loadRes(url, cc.SpriteFrame, function (err, spriteFrame) {
|
||||
self.leftNode.getComponent(cc.Sprite).spriteFrame = spriteFrame;
|
||||
});
|
||||
self.scrolling = false;
|
||||
}, this, {});
|
||||
let moveCurrent = cc.moveTo(0.5, 750, 13);
|
||||
var seq = cc.sequence(moveCurrent, moveFinish);
|
||||
self.currentNode.runAction(seq);
|
||||
self.leftNode.runAction(cc.moveTo(0.5, 0, 13));
|
||||
}
|
||||
});
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user