Question

在Famous中是否有对模态的内置支持？

我完成了着名大学并查看了文档，但没有看到任何内容。

我即将推出自己的，但我想我应先问一下。

Answer 1

您将要使用Lightbox对象。 Lightbox就像一个具有状态的RenderController。这意味着您可以通过转换和转换来定义视图如何进入视图之外。以下是您在iOS中经常看到的模态类型的一个非常基本的示例。

希望它有所帮助！

var Engine          = require('famous/core/Engine');
var Surface         = require('famous/core/Surface');
var Transform       = require('famous/core/Transform');
var Modifier        = require('famous/core/Modifier');

var Lightbox        = require('famous/views/Lightbox');
var Easing          = require('famous/transitions/Easing');

var context = Engine.createContext();

var surface = new Surface({
    size:[200,200],
    properties:{
        backgroundColor:'green',
        color:'white',
        lineHeight:'200px',
        textAlign:'center'
    }
});

surface.on('click',function(){ openModal() });

context.add(new Modifier({origin:[0.5,0.5]})).add(surface);

var modal = new Surface({
    size:[500,500],
    properties:{
        backgroundColor:'red'
    }
})

modal.on('click',function(){ hideModal() });

modal.lightbox = new Lightbox({
    inTransform: Transform.translate(0,500,0),
    outTransform: Transform.translate(0,500,0),
    inTransition: {duration:1000, curve:Easing.outElastic},
    outTransition: {duration:200, curve:Easing.inOutQuad},
});

context.add(new Modifier({origin:[0.5,0.5]})).add(modal.lightbox);


function openModal(){
    modal.lightbox.show(modal);
}

function hideModal(){
    modal.lightbox.hide();
}

内置弹出模式

1 个答案: