Titanium MobileでRSSを読むアプリサンプルを書きなおしてみた

Tweet

昨日書いたTitanium Mobileで生成できるRSS表示するアプリサンプルを、オブジェクトにまとめて書きなおしてみました。

でも、Titanium Mobileで想定している分割とは違うみたいです。そろそろ、サンプルアプリのKitchenSinkを参考にする時かな……

// feed  を取得して、TableViewに表示する
var FeedReader = function(feedUrl) {
  this.feedItems = []; // 画面表示されている全てのfeedアイテム
  this.feedUrl = feedUrl; // 読み込むfeedのURL
  this.offset = 1; // YQLで読み込むfeedの位置
  this.limit = 3; // YQLで一度に読み込むfeedの数
  this.tableView = Titanium.UI.createTableView({  data: [] });
  this.win = Titanium.UI.createWindow({ title: 'news', });
  this.win.add( this.tableView );
  this.tab = Titanium.UI.createTab({
    window: this.win,
    icon: 'KS_nav_ui.png',
    title: '最新情報',
  });
  this.setEvent();
  this.feedGet();
};
FeedReader.prototype = {
  getTab: function() {
    return this.tab;
  },
  feedGet : function() {
    var self = this;
    // RSS を取得して、TableViewに表示する
    var query = 'SELECT * FROM rss WHERE url="'
     + this.feedUrl + '" limit '
     + this.limit + ' offset '
     + this.offset;
    // alert(query);
    Titanium.Yahoo.yql(query, function ( e ) {
      if ( self.feedItems.length > 0 ) {
        // tableView1の最後の項目を消す
        self.tableView.deleteRow( self.tableView.data[0].rowCount - 1 );
      }
      if ( !( e.data ) ) {
      // YQLのレスポンスが失敗の時
        alert( 'YQLのレスポンスエラー。エラーメッセージ：' + e.message );
      }
      else {
      // YQLのレスポンスが成功の時
        var rssitems = e.data.item; 
        rssitems.forEach ( function( item ){
          self.feedItems.push( item );
          self._appendRow( item );
          self.offset++;
        });
        self._appendRowReadNext();
      }
    });
  },
  // feed項目をtableViewに追加する
  _appendRow: function( item ) {
    var row = Titanium.UI.createTableViewRow();
    row.className = 'entry';
    row.height = 'auto';
    row.layout = 'vertical';
    row.add(Titanium.UI.createLabel({
      text: item.title,
      top:    '4dp',
      left:   '4dp',
      right:  '4dp',
      height: 'auto',
      color:  'white',
      font: { fontWeight: 'bold',
          fontSize: '15dp',
      },
    }));
    row.add(Titanium.UI.createLabel({
      text: item.description.slice( 0, 50 ) + '……',
      top:    '0dp',
      left:   '4dp',
      right:  '4dp',
      height: 'auto',
      font: { fontSize: '13dp', },
    }));
    row.add(Titanium.UI.createLabel({
      text: item.date.replace( 'T', ' ' )
             .replace( '+09:00', '' ),
      left:   '4dp',
      height: 'auto',
    }));
    this.tableView.appendRow( row );
    return;
  },
  // 「続きを読む」項目をtableViewに追加する
  _appendRowReadNext: function () {
    var row = Titanium.UI.createTableViewRow();
    row.className = 'entry';
    row.height = 'auto';
    row.layout = 'vertical';
    row.add(Titanium.UI.createLabel({
      text: '続きを読む',
      textAlign: 'center',
      top:    '4dp',
      left:   '4dp',
      right:  '4dp',
      height: '42dp',
      color:  'white',
      font: { fontWeight: 'bold',
          fontSize: '15dp',
      },
    }));
    this.tableView.appendRow( row );
    return;
  },
  // TableView1内がタップされたときの動作を定義する
  setEvent: function() {
    var self = this;
    this.tableView.addEventListener(
      'click',
      function( e ) {
        if (e.index < ( self.tableView.data[0].rowCount - 1) ) { 
          var entryWindow;
          var entryView;
          // 新しくWindowを作ってWebViewを表示します
          entryWindow = Titanium.UI.createWindow({
            title: self.feedItems[ e.index ].title
          });
          entryView = Titanium.UI.createWebView({
            url: self.feedItems[ e.index ].link
          });
          entryWindow.add( entryView );
          // 現在のTabでWebViewのWindowを表示
          self.tab.open( entryWindow );
        }
        else {
          self.feedGet();
        }
      }
    );
    return;
  },  
};
 
var feedReader = new FeedReader('http://feeds.feedburner.com/MCPC');
// TabGroupを作る
var tabGroup = Titanium.UI.createTabGroup();
// tabGroupにtabを追加
tabGroup.addTab( feedReader.getTab() );
// TabGroupを表示
tabGroup.open();

2012.01.09 21:17 投稿　大野 義貴 [Web] | 固定リンク |