Webview 관련 질문

JavaScript Titanium
1

https://github.com/andi2/MASlidingMenu-master

위  링크에서 Sliding Menu (페이스북 UI) 소스를 다운 받아서 webview 를 적용케 하려고 합니다. webview.js 를 만들어 ㅇㅇ메뉴에서 들어가면 webview 를 불러오고 싶은데요. 위 소스에서 어떻게하면 webview 를 불러올 수 있을까요 ?

일반적인 url:’oo.js’ 도 해봤는데 잘 안되네요 ㅠㅜ

아래는 관련 소스입니다.

(다운받으시면 전체를 보실 수 있습니다.)

–

*app.js

..

var MASlidingMenu = require(‘/lib/MASlidingMenu’);

var HomeView = require(‘/ui/HomeView’);

var SampleView = require(‘/ui/SampleView’);

var MenuView = require(‘/ui/MenuView’);

 

var home = new HomeView();

 

var settings = new SampleView();

 

// Each row with a view property when clicked will change to that view (any view works except tabgroups and windows)

// If the row does not have a view property, but the switch event still fires

var data = [

{ title:'Home', hasDetail:true, view: home },

{ title:'Sample', hasDetail:true, view: settings },

{ title:'Button' }

];

 

var menu = new MenuView({

rowData: data

});

 

var slidingMenu = new MASlidingMenu({

left: menu, // the menu… only accepts a tableview

draggable: true // set false to only use the API to open / close

});

slidingMenu.open();

 

// event fired when user selects a view from the nav

slidingMenu.addEventListener(‘buttonclick’, function(e) {

if (e.index === 2) {

alert(‘You clicked on Button’);

}

});

 

// event fired when user selects a view from the nav

slidingMenu.addEventListener(‘switch’, function(e) {

//alert(e.menuRow);

//alert(e.index);

//alert(e.view); // This is the new view your switching to

});

 

// event fired while user is dragging the view to expose the menu

slidingMenu.addEventListener(‘sliding’, function(e) {

//alert(e.distance);

});

 

//Expose / close the menu programaticly

//slidingMenu.slideView(‘left’);

//slidingMenu.slideView(‘view’);

 

// Access the currently displayed view

//slidingMenu.activeView();

 

—

*HomeView.js (app.js 의 home 메뉴)

..

var MASlidingView = require(‘lib/MASlidingView’);

 

var HomeView = function(args){

var self = new MASlidingView({

backgroundColor:’red’

});

self.add(Ti.UI.createLabel({

text:’Home View’,

color:’#000′,

height:24,

width:100,

textAlign:’center’,

}));

 

return self;

};

 

module.exports = HomeView;

 

 

 

 

 

 

 

var MASlidingView = require(‘lib/MASlidingView’);

 

var HomeView = function(args){

var self = new MASlidingView({

backgroundColor:’red’

});

self.add(Ti.UI.createLabel({

text:’Home View’,

color:’#000′,

height:24,

width:100,

textAlign:’center’,

}));

 

return self;

};

 

module.exports = HomeView;

 

 


Facebook Group's likes and commnets
Seung Gon(02-15 14:45) : 포럼에서는 띄어쓰기가 되는데, 페북서 적용은 안되는군요 ; 링크를 클릭하시면 편하게 확인하실 수 있습니다.
Seung Gon(02-15 18:29) : 감사합니다. ^^
2

어쨋든 SampleMenu를 누르면 Webview가 나오고 싶다면 SampleView.js에서 MASlidingView에다가 webview를 add하면 됩니다.
그런데 이렇게 할경우 drag를 통해 메뉴를 볼수는 없습니다. 왜냐면 touch이벤트가 webview에서 먹어버리기 때문입니다. 그냥 MASlidingMenu의 open, close 함수를 통해 해야 할거에요.

var MASlidingView = require('lib/MASlidingView');

var SampleView = function(args){

var view = new MASlidingView({

backgroundColor:‘white’

});


view.add(Ti.UI.createWebView({
	url : 'http://daum.net'
}));

return view;



};


module.exports = SampleView;

질문을 올려주실때 코드는 crayon 플러그인을 통해 입력해주시면 위 코드처럼 보기 좋게 나옵니다.^^ crayon을 이용하기위해서는 글쓸때 바로 위에있는 여러 버튼들 중에 crayon을 이용하면 됩니다.^^
그리고 남기신 링크의 MASlidingMenu는 원래 https://github.com/appersonlabs/MASlidingMenu 가 원본입니다. fork를 하지 않고 그냥 다시 커밋한것 같네요.

3

맨 마지막 소스가 더 들어갔네요. “ HomeView.js” 소스는 module.exports = HomeView; 까지 입니다.