2013-02-20 3 views
2

Definining KineticJS I этап идти, как это:KineticJS андроида размер ступени

var stage = new Kinetic.Stage({ 
    container: 'container', 
    width: 320, 
    height: 480 
    }); 

Так ширина и высота ступени имеют фиксированный размер. Как растянуть его, чтобы поместиться на экране телефона, если разрешение отличается?

+0

добавил яваскрипт тега – SoluableNonagon

ответ

2

Ну, это действительно вопрос javascript. Вы хотите сделать размер сцены таким же, как размер окна. Это работает для меня на моем андроида проекте:

var stage = new Kinetic.Stage({ 
     container: 'container', 
     width: window.innerWidth, 
     height: window.innerHeight 
}); 

Edit:
Кроме того, я рекомендую вам добавить JQuery, а поэтому вы можете проверить изменения ориентации, то вы можете сделать что-то вроде:

window.onresize = function(event) { //this function will resize your stage to the size of your window 
    stage.setWidth(window.innerWidth); 
    stage.setHeight(window.innerHeight); 
    stage.draw(); //redraw the stage, not sure if really needed, but good to have. 
} 

или вы могли бы сделать:

window.onresize = function(event) { 
    stage.setScale(x,y); //set x, y scale values when the orientation changes 
    stage.draw(); //redraw the stage, not sure if really needed, but good to have. 
} 
+0

ли KineticJS заботится о масштабирование событий касания? – carobnodrvo

+0

Весы хорошо для меня. Здесь, взгляните на этот пример, вы увидите, что вы все равно можете перетащить правильно, независимо от масштаба. http://cs.neiu.edu/~tsam/planets/index.phtml работает как для touch, так и для рабочего стола – SoluableNonagon

+0

Спасибо, это очень помогло мне! Но у меня есть еще одна проблема: Теперь он отлично масштабируется, но когда я касаюсь экрана, он мигает прозрачным синим цветом во всем теге div. Я использую [this] (http://www.html5canvastutorials.com/kineticjs/html5-canvas-desktop-and-mobile-support/) пример. – carobnodrvo

Смежные вопросы