[ Titanium Mobile ] 透過 PNG のボタン画像を使う方法 #titaniumjp

スポンサードリンク

Titanium Mobile で、透過 PNG のボタン画像 ( イメージボタン ) を使うサンプルです。

Tibtnimg

▲ ボタンを押した時の画像も準備します。

サンプルコード

コードは次のような感じです。

var win = Ti.UI.createWindow({
    title:'ボタンテスト',
    backgroundColor:'#f00'
});

var TestButton = Ti.UI.createButton({
    backgroundImage:'btn_test.png',
    backgroundSelectedImage:'btn_test_o.png',
    top:10,
    left:10,
    height:60,
    width:300
});

win.add(TestButton);
win.open();

配置した画像は、次の二点です。

Btn test

▲ ボタンを押す前。

Btn test o

▲ ボタンを押した時。

分かった事

  • [ backgroundSelectedImage ] を指定しなくても押すと薄暗くなる処理が入った。
  • Retina ディスプレイ対応は、長さが倍の画像を作ってサイズ指定で半分にする。

参考にさせてもらったページ

ありがとうございます!

スポンサードリンク

この記事が気に入ったら、ぜひシェアをお願いします!

コメントを残す

メールアドレスが公開されることはありません。