文档章节

放大镜实现代码3

y
 yizhangxyz
发布于 2016/04/13 11:49
字数 885
阅读 7
收藏 0

#ifndef Magnifier_h

#define Magnifier_h


#include "cocos2d.h"

#include "STMacro.h"

#include "STFilter.h"

#include "STTouchableSprite.h"


NS_ST_BEGIN


USING_NS_CC;

using namespace std;



/**

 放大镜

 */

class STMagnifier : public Node

{


    STFilter *m_pFilter;

    STTouchableSprite *m_handShank;

    

public:

    

    /**

     使用图片路径来初始化

     @param handShank 放大镜手柄

     @param stencil   透视图片

     @param content   放大查看的图片

     */

    static STMagnifier * create(STTouchableSprite *handShank,Sprite *stencil, Sprite *content);

    

    /**

     使用图片路径来初始化

     @param handShank 手柄图片路径

     @param stencil   透视图片路径

     @param content   放大查看的图片路径

     */

    static STMagnifier * createWithPath(const string &handShankPath,const string &stencilPath, const string &contentPath);

    

    /**

     使用图片Frame名称来初始化

     @param handShank 手柄图片Frame名称

     @param stencil   透视图片Frame名称

     @param content   放大查看的图片Frame名称

     */

    static STMagnifier * createWithFrameName(const string &handShankName,const string &stencilName, const string &contentName);

    

    /*

     屏幕快照

     */

    static Sprite* snapshot();

    

public:

    /*

     设置放大倍数

     */

    void setZoomSize(float size);

    

    /*

     获取手柄,用于设置手柄坐标

     */

    STTouchableSprite* getHandShank();

    

    /*

     设置放大镜坐标

     */

    void setMagnifierPosition(const Vec2 &pos);

    

protected:

    

    STMagnifier();

    

    virtual ~STMagnifier();

    

    virtual bool init(STTouchableSprite *handShank,Sprite *stencil, Sprite *content);

    

    virtual bool initWithPath(const string &handShankPath,const string &stencilPath, const string &contentPath);

    

    virtual bool initWithFrameName(const string &handShankName,const string &stencilName, const string &contentName);

    

    

private:

    /*

     移动放大镜

     */

    void moveMagnifier(const Vec2 &delta);

    

    /*

     获取放大区域在屏幕的百分比[0,1]

     */

    Vec2 getZoomPosition();

};


/*

 //手柄

 auto hanshank = STTouchableSprite::createWithSpriteFrameName("stencil.png");

 //镂空区域

 auto stencil = Sprite::createWithSpriteFrameName("stencil.png");

 //放大查看的内容

 //auto content = Sprite::create("Levels/Level1/level1_body_3.jpg");

 auto content = STMagnifier::snapshot();

 //放大镜

 auto magnifier = STMagnifier::create(hanshank,stencil, content);

 

 //this->addToUILayer(magnifier,kPop);

 this->addChild(magnifier,kPop);

 

 //设置放大倍数

 magnifier->setZoomSize(2);

 //调整手柄坐标

 magnifier->getHandShank()->setAnchorPoint(Vec2(0.5f, 0.5f));

 // 设置初始坐标

 magnifier->setMagnifierPosition(Vec2(200, 200));

 */

NS_ST_END


#endif /* Magnifier_hpp */


#include "STMagnifier.h"

#include "VisibleRect.h"



USING_NS_ST;


STMagnifier * STMagnifier::create(STTouchableSprite *handShank,Sprite *stencil, Sprite *content)

{

    auto node = new (std::nothrow) STMagnifier();

    if ( node && node->init(handShank,stencil, content) )

    {

        node->autorelease();

        return node;

    }

    

    CC_SAFE_DELETE(node);

    return nullptr;

}



STMagnifier * STMagnifier::createWithPath(const string &handShankPath,const std::string &stencilPath, const std::string &contentPath)

{

    auto node = new (std::nothrow) STMagnifier();

    if ( node && node->initWithPath(handShankPath,stencilPath, contentPath) )

    {

        node->autorelease();

        return node;

    }

    

    CC_SAFE_DELETE(node);

    return nullptr;

}


STMagnifier * STMagnifier::createWithFrameName(const string &handShankName,const std::string &stencilName, const std::string &contentName)

{

    auto node = new (std::nothrow) STMagnifier();

    if ( node && node->initWithFrameName(handShankName,stencilName, contentName) )

    {

        node->autorelease();

        return node;

    }

    

    CC_SAFE_DELETE(node);

    return nullptr;

}


STMagnifier::STMagnifier()

: m_pFilter(nullptr)

, m_handShank(nullptr)

{

    

}


STMagnifier::~STMagnifier()

{

    

}


bool STMagnifier::init(STTouchableSprite *handShank,Sprite *stencil, Sprite *content)

{

    bool bRet = false;

    

    do

    {

        CC_BREAK_IF(!handShank);

        

        CC_BREAK_IF(!stencil);

        

        CC_BREAK_IF(!content);

        

        CC_BREAK_IF( !Node::init() );


        m_pFilter = STFilter::create(stencil, content);

        

        CC_BREAK_IF( !m_pFilter);

        

        m_pFilter->setLimitedInScreen(false);

        

        this->addChild(m_pFilter);

        

        m_handShank = handShank;

        

        this->addChild(m_handShank);

        

        this->setZoomSize(2);

        

        m_handShank->setPosition(VisibleRect::center());

        

        m_handShank->

        setTouchEnable(// began

                       [this](Touch *touch, Event *event)

                       {

                           auto node = event->getCurrentTarget();

                           

                           if ( node->isVisible() )

                           {

                               Rect _rect = Rect(0,0,node->getContentSize().width,node->getContentSize().height);

                               _rect = RectApplyTransform(_rect,node->getNodeToWorldTransform());


                               if ( _rect.containsPoint(touch->getLocation()) )

                               {

                                   return true;

                               }

                           }

                           

                           return false;

                       },

                       

                       // move

                       [this](Touch *touch, Event *event)

                       {

                           if ( !m_handShank->isVisible() )

                               return;

                           

                           this->moveMagnifier(touch->getDelta());

                       }

                       

                       );

        

        // 屏蔽事件

        auto touchListener = EventListenerTouchOneByOne::create();

        touchListener->setSwallowTouches(true);

        touchListener->onTouchBegan = [this](Touch*, Event*)

        {

            return true;

        };

        

        _eventDispatcher->addEventListenerWithSceneGraphPriority(touchListener, this);


        bRet = true;

        

    } while (false);

    

    return bRet;

}


bool STMagnifier::initWithPath(const string &handShankPath,const std::string &stencilPath, const std::string &contentPath)

{

    auto handShank = STTouchableSprite::create(handShankPath);

    

    if (!handShank)

        return false;


    

    auto stencil = Sprite::create(stencilPath);

    

    if (!stencil)

        return false;

    

    auto content = Sprite::create(contentPath);

    

    if (!content)

        return false;

    

    return init(handShank,stencil, content);

}


bool STMagnifier::initWithFrameName(const string &handShankName,const std::string &stencilName, const std::string &contentName)

{

    auto handShank = STTouchableSprite::createWithSpriteFrameName(handShankName);

    

    if (!handShank)

        return false;

    

    auto stencil = Sprite::createWithSpriteFrameName(stencilName);

    

    if (!stencil)

        return false;

    

    auto content = Sprite::createWithSpriteFrameName(contentName);

    

    if (!content)

        return false;

    

    return init(handShank,stencil, content);

}


Sprite* STMagnifier::snapshot()

{

    Sprite *screenCotent = nullptr;

    

    auto pRender = RenderTexture::create(VisibleRect::getVisibleRect().size.width, VisibleRect::getVisibleRect().size.height);

    

    pRender->begin();

    

    Director::getInstance()->getRunningScene()->visit();

    

    pRender->end();

    

    Director::getInstance()->getRenderer()->render();

    

    pRender->getSprite()->getTexture()->setAliasTexParameters();


    Image* image = pRender->newImage();

    

    Texture2D* texture = new Texture2D();

    

    if( texture && texture->initWithImage(image) )

    {

        screenCotent = Sprite::createWithTexture(texture);

    }

    

    // clean

    CC_SAFE_RELEASE(image);

    CC_SAFE_RELEASE(texture);

    

    return screenCotent;

}


void STMagnifier::setZoomSize(float size)

{

    m_pFilter->getContent()->setScale(size);

}


STTouchableSprite* STMagnifier::getHandShank()

{

    return this->m_handShank;

}


void STMagnifier::setMagnifierPosition(const Vec2 &pos)

{

    Vec2 delta = pos - m_handShank->getPosition();

    

    m_handShank->setPosition(pos);

    m_pFilter->move(delta);


    //before

    Vec2 anchpoint1 = this->m_pFilter->getContent()->getAnchorPoint();

    Vec2 pos1 = this->m_pFilter->getContent()->getPosition();

    Size size = this->m_pFilter->getContent()->getContentSize();

    

    //after

    Vec2 anchpoint2 = this->getZoomPosition();

    Vec2 pos2;

    

    pos2.x = pos1.x +(anchpoint2.x - anchpoint1.x) * size.width;

    pos2.y = pos1.y +(anchpoint2.y - anchpoint1.y) * size.height;

    

    m_pFilter->getContent()->setAnchorPoint(anchpoint2);

    m_pFilter->getContent()->setPosition(pos2);


}


void STMagnifier::moveMagnifier(const Vec2 &delta)

{

    Vec2 pos = m_handShank->getPosition() + delta;

    

    this->setMagnifierPosition(pos);

}


Vec2 STMagnifier::getZoomPosition()

{

    Vec2 pos = m_pFilter->getClippingNode()->convertToWorldSpace(m_pFilter->getStencil()->getPosition());

    

    return Vec2(pos.x/VisibleRect::getVisibleRect().size.width, pos.y/VisibleRect::getVisibleRect().size.height);

}


© 著作权归作者所有

y
粉丝 2
博文 67
码字总数 42366
作品 0
成都
私信 提问
canvas离屏技术与放大镜实现

教程所示图片使用的是 github 仓库图片,网速过慢的朋友请移步>>> (原文)canvas 离屏技术与放大镜实现。 更多讨论或者错误提交,也请移步。 利用除了可以实现滤镜,还可以利用离屏技术放大...

godbmw
2018/08/30
0
0
淘宝放大镜的简单实现,原来道理很简单

前言:自己在学习过程中构思的淘宝放大镜的实现,大佬轻喷,小白可以跟我一起探讨学习。话不多说,我们来看效果图。 首先是html结构,结构主要就三块,放大镜,小图和大图区域,我们都用div...

扶墙哥
2018/08/02
0
0
Silverlight 解谜游戏 之六 放大镜(2)

北京50年罕见暴雪,一会4点就下班了,赶在下班前再发一篇吧。上一篇我们已经添加了MagnifierOverBehavior 放大镜功能,但仍然无法控制该放大镜的开/关状态,本篇将基于一张放大镜图片创建一个...

junwong
2012/03/09
96
0
jQuery+elevateZoom演示多种放大镜效果

elevateZoom 是一个定制性非常高的 jQuery 放大镜插件,可实现电子商务网站中查看大图的效果。它能够对一张图片或两张图片(一张缩略图和一张大图)实现放大效果。放大图片的位置可自定义设置,...

Nonry
2017/01/16
106
0
基于 Vue 的商品主图放大镜方案

本文首发于政采云前端团队博客: 基于 Vue 的商品主图放大镜方案 前言 在做电商类应用时,难免会遇到商品主图实现放大镜效果的场景,现有的基于的第三方包不多并且无法直接复用,今天,我来分...

政采云前端团队
09/19
0
0

没有更多内容

加载失败,请刷新页面

加载更多

java通过ServerSocket与Socket实现通信

首先说一下ServerSocket与Socket. 1.ServerSocket ServerSocket是用来监听客户端Socket连接的类,如果没有连接会一直处于等待状态. ServetSocket有三个构造方法: (1) ServerSocket(int port);...

Blueeeeeee
今天
6
0
用 Sphinx 搭建博客时,如何自定义插件?

之前有不少同学看过我的个人博客(http://python-online.cn),也根据我写的教程完成了自己个人站点的搭建。 点此:使用 Python 30分钟 教你快速搭建一个博客 为防有的同学不清楚 Sphinx ,这...

王炳明
昨天
5
0
黑客之道-40本书籍助你快速入门黑客技术免费下载

场景 黑客是一个中文词语,皆源自英文hacker,随着灰鸽子的出现,灰鸽子成为了很多假借黑客名义控制他人电脑的黑客技术,于是出现了“骇客”与"黑客"分家。2012年电影频道节目中心出品的电影...

badaoliumang
昨天
16
0
很遗憾,没有一篇文章能讲清楚线程的生命周期!

(手机横屏看源码更方便) 注:java源码分析部分如无特殊说明均基于 java8 版本。 简介 大家都知道线程是有生命周期,但是彤哥可以认真负责地告诉你网上几乎没有一篇文章讲得是完全正确的。 ...

彤哥读源码
昨天
18
0
jquery--DOM操作基础

本文转载于:专业的前端网站➭jquery--DOM操作基础 元素的访问 元素属性操作 获取:attr(name);$("#my").attr("src"); 设置:attr(name,value);$("#myImg").attr("src","images/1.jpg"); ......

前端老手
昨天
7
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部