Hatena::ブログ(Diary)

PHP,MySQL,Flex,JSな日々+イラストとか このページをアンテナに追加 RSSフィード Twitter

2008年05月04日

AIRでバーコードリーダーを使ったアプリ

AIRでバーコードリーダーを使って書籍管理なアプリを作ってみました。

バーコードリーダーを使ってISBNを読み取って入力してます。

そのデータを使ってAmazonから本データを検索し、SQLに保存することができます。

動作ムービーはこちら

D

お試しAIRファイルはこちら

http://moeten.info/flex/20080504_sqliteTest/main.air

f:id:haru-komugi:20080504212338j:image

使用しているバーコードリーダーは日本システックスのFFTA 10Aってものです。

Windowsだとドライバがいらないと思います。

また、入力は単純で、バーコードリーダーのボタンを押すだけで、読み取ったデーターをキーボードと同じように入力してくれます(+最後にリターンキー付き)。

SQLコネクト部分

var conn:SQLConnection;
var dbfile:File = File.desktopDirectory;
dbfile = dbfile.resolvePath("ipl_amazon.db");
conn = new SQLConnection();
conn.open(dbfile);

これだけでデータベースファイルの作成とSQLへのコネクションを行うことができます。

SQLの送信方法

外部変数:private var conn:SQLConnection;
外部変数:private var stmt:SQLStatement;
stmt = new SQLStatement();
stmt.sqlConnection = conn;
stmt.text =    " SELECT * FROM ipl_amazon WHERE print = 1 ORDER BY id DESC ";
stmt.addEventListener(SQLEvent.RESULT , getFinish );
stmt.execute();

あとはSQL完了イベント

private function getFinish(e:Event):void{
    dg.dataProvider = stmt.getResult().data;
}

AIRなソースはこちら

<?xml version="1.0" encoding="utf-8"?>
<mx:WindowedApplication xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute"
    verticalScrollPolicy="off" horizontalScrollPolicy="off" backgroundAlpha="0.8" backgroundColor="0xffffff" showStatusBar="false"
    creationCompleteEffect="thisShow"
    dropShadowEnabled="true"
    closeEffect="thisHide"
    creationComplete="init()" width="425" height="646" backgroundGradientAlphas="[0.0, 0.0]" alpha="1.0"
    borderColor="#FFDEFE" backgroundGradientColors="[#FFD9D9, #FFD9D9]" viewSourceURL="srcview/index.html">
<mx:Script>
<![CDATA[
import mx.events.DropdownEvent;
import mx.events.DragEvent;
import mx.collections.ArrayCollection;
import mx.effects.easing.*;
private var conn:SQLConnection;
private var stmt:SQLStatement;
[Bindable]
private var database:ArrayCollection = new ArrayCollection();
//初期化関数
private function init():void{
    setDB();
}
//データベースコネクト
private function setDB():void{
    var dbfile:File = File.desktopDirectory;
    dbfile = dbfile.resolvePath("ipl_amazon.db");
    conn = new SQLConnection();
    conn.open(dbfile);
    createDB();
    getData();
    isbnText.setFocus();
}
//データベース作成
private function createDB():void{
    stmt = new SQLStatement();
    stmt.sqlConnection = conn;
    stmt.text = " CREATE TABLE IF NOT EXISTS ipl_amazon(" +
            " id      INTEGER PRIMARY KEY , " +
            " image   TEXT , " +
            " isbn    TEXT UNIQUE , " +
            " title   TEXT , " +
            " comment TEXT , " +
            " url     TEXT , " +
            " adddate TEXT , " +
            " moddate TEXT , " +
            " type    TEXT , " +
            " print   INTEGER ) ; ";
    stmt.execute();
}
//ログデータ取得
private function getData():void{
    stmt = new SQLStatement();
    stmt.sqlConnection = conn;
    stmt.text =    " SELECT * FROM ipl_amazon WHERE print = 1 ORDER BY id DESC ";
    stmt.addEventListener(SQLEvent.RESULT , getFinish );
    stmt.execute();
}
//ログデータをデータグリッドへ
private function getFinish(e:Event):void{
    dg.dataProvider = stmt.getResult().data;
}
//ISBN番号からアマゾン情報を取得
private function getAmazonData():void{
    if( isbnText.text != "" ){
        amazonS.send({
            "isbn":isbnText.text
        });
    }
}
//データーの追加
private function addData():void{
    isbnText.text = "";
    stmt = new SQLStatement();
    stmt.sqlConnection = conn;
    if( amazonS.lastResult ){
    stmt.text = " INSERT INTO ipl_amazon ( id , image ,isbn , title , url , print )VALUES(" +
            "NULL , '" +
            amazonS.lastResult.LargeImage +    "' , '" +
            amazonS.lastResult.ISBN       + "' , '" +
            amazonS.lastResult.Title      + "' , '" +
            amazonS.lastResult.DetailPageURL + "'   , '1' )";
     try{
         stmt.execute();
     }catch(e:SQLError){
     }
    getData();
    tl.visible = false;
    }
    isbnText.setFocus();
    dgAdd.play();
}
//データの削除
private function deleteData():void{
    stmt = new SQLStatement();
    stmt.sqlConnection = conn;
    stmt.text = " DELETE FROM ipl_amazon WHERE id = '"+ dg.selectedItem.id +"' ";
     stmt.execute();
     getData();
     isbnText.setFocus();
    dgAdd.play();
}
private function detailData():void{
    htmlShow.play();
    myHtml.location = dg.selectedItem.url;
}
]]>
</mx:Script>
<mx:Style>
.noBorder{
    borderStyle: solid;
    borderThickness:0;
}
</mx:Style>
<!--############## HTTPサービス #############-->
<mx:HTTPService id="amazonS"
     url="http://moeten.info/flex/20080308_amazonBook/index2.php"
     useProxy="false" resultFormat="e4x" showBusyCursor="true" method="GET" result="{isbnText.text = '';addBtn.enabled=true;tl.visible=true}" />
<!--############## エフェクト #############-->
<mx:Sequence id="thisShow">
    <mx:Fade alphaFrom="0" alphaTo="1.0"/>
    <mx:Glow blurXFrom="10" blurXTo="20" blurYFrom="10" blurYTo="20" color="0xff0000"/>
</mx:Sequence>
<mx:Sequence id="thisHide">
    <mx:Glow blurXFrom="10" blurXTo="20" blurYFrom="10" blurYTo="20" color="0xff0000"/>
    <mx:Fade alphaFrom="1.0" alphaTo="0"/>
</mx:Sequence>
<mx:Glow id="dgAdd" target="{dg}" blurXFrom="10" blurXTo="20" blurYFrom="10" blurYTo="20" color="0xff0000"/>
<mx:Resize id="tlShow" heightFrom="0" heightTo="160" target="{tl}"/>
<mx:Resize id="tlHide" heightTo="0" target="{tl}"/>
<mx:Resize id="htmlHide" widthTo="425" target="{this}"/>
<mx:Resize id="htmlShow" widthTo="1061" target="{this}"/>
<!--############## コンポーネント #############-->
<mx:ApplicationControlBar x="9" y="5" width="404">
    <mx:Label text="ISBN13"/>
    <mx:TextInput width="157" id="isbnText" change="{isbnText.text = isbnText.text.replace('-',''); if( isbnText.text!= '' &amp;&amp; isbnText.length == 13)getAmazonData();}"/>
    <mx:Button label="本検索" click="getAmazonData()"/>
    <mx:Button id="addBtn" label="本追加" enabled="false" click="addData()"/>
</mx:ApplicationControlBar>
    <mx:VBox x="9" y="47" width="404" height="500">
        <mx:TileList id="tl" width="100%" height="0" dataProvider="{amazonS.lastResult}"
            showEffect="tlShow" visible="false" hideEffect="tlHide"
            columnCount="1" columnWidth="362" selectable="false">
            <mx:itemRenderer>
                <mx:Component>
                    <mx:HBox width="362" height="166" horizontalScrollPolicy="off" verticalScrollPolicy="off">
                        <mx:Image source="{data.LargeImage}" width="100" height="140"/>
                        <mx:VBox>
                        <mx:Text text="{data.ISBN}" fontSize="12" color="0xcccccc"/>
                        <mx:TextArea width="240" height="100" text="{data.Title}"
                            color="0x0000ee" fontSize="20" textAlign="left" editable="false" styleName="noBorder"/>
                        </mx:VBox>
                    </mx:HBox>
                </mx:Component>
            </mx:itemRenderer>
        </mx:TileList>
        <mx:DataGrid id="dg" width="100%" height="100%" rowHeight="50" dragEnabled="true" dragMoveEnabled="true"
             doubleClick="{detailData()}" doubleClickEnabled="true"
            >
            <mx:columns >
                <mx:DataGridColumn headerText="ID" dataField="id" width="25"/>
                <mx:DataGridColumn width="40" headerText="画像">
                <mx:itemRenderer>
                    <mx:Component>
                        <mx:Image source="{data.image}" width="40" height="50"/>
                    </mx:Component>
                </mx:itemRenderer>
                </mx:DataGridColumn>
                <mx:DataGridColumn headerText="タイトル" dataField="title"/>
                <mx:DataGridColumn headerText="URL" dataField="url" visible="false"/>
            </mx:columns>
        </mx:DataGrid>
    </mx:VBox>
    <mx:DataGrid id="trushdg" x="363" y="555" width="50" height="50" styleName="noBorder"  dropEnabled="true"  backgroundImage="trush.jpg" dragDrop="deleteData()">
        <mx:columns>
            <mx:DataGridColumn headerText="ゴミ箱" dataField="id" visible="false"/>
        </mx:columns>
    </mx:DataGrid>
    <mx:HTML id="myHtml" showEffect="htmlShow" hideEffect="htmlHide" x="425" y="10" width="577" height="595"/>
    <mx:Button x="1010" y="209" label="←" width="38" height="112" click="htmlHide.play()"/>
    <mx:Label x="10" y="555" text="*アイテムをダブルクリックで詳細表示" color="#45646A"/>
</mx:WindowedApplication>

スパム対策のためのダミーです。もし見えても何も入力しないでください
ゲスト


画像認証

トラックバック - http://d.hatena.ne.jp/haru-komugi/20080504/1209904882