Cocos2d-x-3.4-025-cocos2dx3.4, cocos2dx3.4, cocos2dx3.4
The original text is synchronously published on my wiki. To view the original text or updates, go to: Click the open link.
What is the end of the battle of the hobbit 3-five? Ideas
- Fade in fade out animation, cocos scene switching animation TransitionCrossFade is consistent with this effect
- It is not difficult to play background music. For more information, see the official documentation.
- When fade in is used, the image is slightly zoomed in. You should simply scale the image using the API.
Material preparation code
- Complete Project see https://github.com/cheyiliu/Cocos2d-x-scene-transition
- General ideas: 1. use TransitionCrossFade to implement switching between images; 2. use a zoom animation to zoom in each image after switching; 3. details 1: in combination with the switching effect time, the scaling animation must be delayed to avoid freezing. 4. details 2: loyal to the effect of the original movie, and added the "door slit" effect processing. That is, each scene has three layers, and one layer is responsible for displaying and enlarging the switched image, the other two layers form a "door slit" to block the upper and lower edges of the first layer.
- The idea of FadeIn FadeOut is to use the scene switching animation effect TransitionCrossFade,
// Switch Action void HelloWorld: doTrans (float dt) {log ("do trans from % d", sIndex); Director: getInstance ()-> replaceScene (TransitionCrossFade :: create (1, HelloWorld: scene ();} // play the next picture scheduleOnce (schedule_selector (HelloWorld: doTrans) after 5 seconds );
- When FadeIn is scaled up slowly, a magnified Action is played. For details 1, combined with the switching time of TransitionCrossFade, this animation requires a certain delay before it gets stuck'
auto actionSeq = Sequence::create( DelayTime::create(1), ScaleTo::create(4, 1.08f), nullptr); sprite->runAction(actionSeq);
- Details 2: because our materials come, there is a black edge on the top and bottom of the image itself, and the middle is the movie content. If the image is directly zoomed in, the image is zoomed in together. The film content is partially zoomed in and the Black edge space on the top and bottom is squeezed. After switching to the next image, the Black edge space is restored and then squeezed with the animation. Therefore, we need special processing. The final special processing idea is to add two non-transparent black layers to the top and bottom, so that it will be consistent with the effect of the movie. Similar to the effect of looking out from the door, no matter how the outside world is enlarged, but the visual scope given to us through the door is fixed.
Float width = designResolutionSize. width; float height = 100; // estimated value: auto layerBot = LayerColor: create (Color4B (0, 0, 0, 0xFF), width, height ); layerBot-> setAnchorPoint (Vec2 (0, 0); layerBot-> setPosition (0, 0); scene-> addChild (layerBot); auto layerTop = LayerColor :: create (Color4B (0, 0, 0, 0xFF), width, height); layerTop-> setAnchorPoint (Vec2 (0, 0); layerTop-> setPosition (0, designResolutionSize. height-height); scene-> addChild (layerTop );
- Linux Command:
byzanz-record -d 4 -x 10 -y 150 -w 810 -h 460 huobite3.gifThis time it was a little big, and everyone was impatient to preview it. If you have better tools, please feel free to recommend them.
- Address 1 (1.5 M) https://github.com/cheyiliu/All-in-One/blob/master/res/cocos2d/cocos%E4%BB%BF%E9%9C%8D%E6%AF%94%E7%89%B9%E4%BA%BA3%E7%89%87%E5%B0%BE-2.gif
- Address 2 (7.9 M) https://github.com/cheyiliu/All-in-One/blob/master/res/cocos2d/cocos%E4%BB%BF%E9%9C%8D%E6%AF%94%E7%89%B9%E4%BA%BA3%E7%89%87%E5%B0%BE.gif
Tucao
- Why is cocos simple ?!
- The Last Goodbye is really nice.
- Welcome fork, star and pull requests to this demo repository.
Extension
- After-school questions, how can I use cocos to implement subtitles that scroll up or down after the last huobi character image is displayed?
