2015年3月26日 星期四

Android的畫廊 - Gallery與ImageSwitcher

Android有提供Gallery及ImageSwitcher的控件,結合這個兩個控件可以很容易地做出一個簡單的小畫廊。

Gallery:

  1. 可以配合Adapter,將圖片的資放進Adapter中,在用Gallery的setAdapter()方法就可以讓Gallery能夠顯示相應的圖片,其中還可以配合OnItemSelectedListener來取得是哪一張圖片被Select。
  2. 在這裡所謂被Select是指哪一張圖案在Gallery的正中央。
  3. 記得Gallery要設置Spacing的屬性,圖片才不會擠在一起。

ImageSwitcher:

  1. ImageSwitcher可以容易的切換兩張ImageView,並且可以為切換圖片的動作設定動畫(Animation)。
  2. 當呼叫ImageSwitcher的setImageResource()方法時,ImageSwitcher其實是設定好下一個ImageView再切換到下一個ImageView。
  3. 在使用ImageSwitcher時要用setFactory()方法設定ViewFactory,而ViewFactory要Override一個makeView()方法並回傳一個ImageView,也就是ImageSwitcher要用來顯示圖的ImageView。
  4. 對於ImageSwitcher的細節原理,在這篇Android_TextSwitcher和ImageSwitcher有非常詳盡的解說。
下面我就用程式碼來製作一個小型簡單的畫廊來做示範:

2015年3月24日 星期二

Android的小工具(App Widget)

App Widget就是我們很常見到的Android桌面小工具,要製App Widget需要有一些步驟,這裡也一個有三個按鈕的小工具來做示範:

  1. 製作要給小工具用的Layout,程式碼如下所示

  2. appwidgetlayout.xml :
    <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical" >
    
        <Button
            android:id="@+id/buttonToToast"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="按下後跳出訊息(Toast)" />
    
        <Button
            android:id="@+id/buttonToNotify"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="按下後發送通知(Notification)" />
    
        <Button
            android:id="@+id/buttonToOpenActivity"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="按下後前往另一個Activity" />
    
    </LinearLayout>
    

2015年3月19日 星期四

用Matlab與Arduino的序列阜溝通

Arduino可以以序列阜(Serial Port)的方式與電腦溝通,只要雙方設置好對應的Baud Rate即可,電腦有許多種選擇,不管是什麼程式語言,只要找到能夠跟序列阜溝通的方法,就能夠以序列阜的方式跟Arduino溝通。

之前的一篇有介紹到以Java來跟Arduino溝通,這篇是要介紹使用Matlab的方式。

在網上搜查之後,找到了兩種主要的常見方法,可以參考這篇文,寫得非常詳細:
【經驗分享】Matlab和Arduino
,其中也寫到了如何用Simulink來跟Arduino溝通。

兩種主要的方法為:
1.使用Matlab Arduino Support package。
2.使用Matlab本身的指令去跟Serial Port連接。

第一種方法在【經驗分享】Matlab和Arduino有詳細的解說,要把其所附的程式燒錄到Arduino枚子上,然後用Matlab只接控制Arduino,使用方便,但其缺點為Arduino上不行燒錄自己所寫的Arduino程式,可以把它想成把原來在Arduino上寫的程式全部搬到了Matlab上面去執行。

在這裡我主要介紹第二種方法,此方法不用任何套件,單純就Matlab本身去跟Seriao Port去溝通。

2015年3月15日 星期日

使用線上免費網頁樣式CSS風格(以JSP為例)

在撰寫網頁時,我們通常會為html另外寫CSS來設定其樣式,讓網頁各頁面的版面可以有一個統一的樣式風格,也比較好管理。

除了自己撰寫CSS外,還可以從網路上找到許多免費的樣式資源,可以免費的下載下來使用,有的是就是一個單統的CSS檔,而有的稍微用了其他的方法來匯入CSS檔(例如JQuery),而CSS的路徑的也要設正確。總之根據不同的免費CSS資源,需要稍微的修改一下才能使用。

Templated是一個提供各種網頁樣式的網站,有許多的免費樣式可以下載使用。因為在之前的使用上花了一點時間搞定,特在此紀錄一下以Templated網站中的一個樣式Transit為例的使用方法。

進入Transit頁面後(如下圖),可以在上面橫幅的右邊下載其樣式,在Elements的連結中可以點進去看到此樣式的各個html元件的樣子,可以看看自己喜不喜歡在下載使用。


下載下來解壓縮後,可以看到如下的檔案結構,其中根目錄的三個html是網頁範例,css、fonts、images、js各是CSS、字型、圖片和JQuery資料夾。

2015年3月5日 星期四

用Java與Arduino的序列阜溝通(使用RXTX)

最近在玩Arduino,研究如何使用Java利用序列阜跟Arduino溝通,找到了幾篇蠻不錯實用的資料:

基本上有兩種常用的方法:
  1. 使用Java Communications,它原本是Sun公司維護的,不過似乎現在已經沒有人再做了,在Oracle網站上只能找到API的說明書但卻沒有下載點。
  2. 使用RXTX,語法跟Java Communications很像但寫法有一點不一樣,使用RXTX可以讓Java使用Serial port(序列阜),達到經由Serial port來傳送資料給Arduino或從Arduino接收資料。
  3. 2016/11/27 更新,第三種方法,使用Ardulink,請參考Ardulink - Arduino的Java控制方案
在這裡,我使用第二種方法,也就是RXTX,RXTX可以在這裡下載,也可從它的RXTX Wiki上進去找,其中也有很多有用的資料,下載完以後,裡面會有兩個dll檔及jar檔,jar的使用方式就跟其它jar使用方式一樣,在編譯器中Add JAR就好,而兩個dll檔,需將它們放到兩處地方:

  1. 為了開發,要放在Java JDK安裝目錄下的bin資料夾下面,參考自
  2. 放在C:\Windows\System32下(當然,是指在Windows平台下)。

上面的提到的資料中,第二個資料是RXTX官方的例子,使用了兩個thread分別執行Serial port的輸入及輸出,使用者可以即時看到接收到的資料和即是的打上資料送出去,需要注意的是,其中這行
serialPort.setSerialPortParams(57600,SerialPort.DATABITS_8,SerialPort.STOPBITS_1,SerialPort.PARITY_NONE);
中的57600是Serial port的通訊速率( baud rate),需要自行修改成與Arduino板子中程式所定的通訊速率一樣,例如Arduino程式的
Serial.begin(9600)
中的9600,不然在接收和傳送訊息時會有問題。
因為覺得官方的例子優雅又實用,為了怕以後忘記,特轉載在最底下(57600已改成9600),可配合我寫的Arduino程式(SerialLightLevelControl)用Serial port的方式用電腦打數字進Console中控制LED燈的亮暗程度。

2015年3月1日 星期日

LaTeXx多個子圖排列,使用subfigure和minipage

在LaTeX中可以使用subfigure和minipage達成多個子圖的排列,跟只使用subfigure不同,如果只使用subfigure的話,只能做到垂直的直向排列。配合minipage的話就可以實現2x2或上2下1等的圖形排列,以下的例子為三張子圖,排列成上2張下1張的情形(在使用subfigure指令時不要忘了使用subfigure的package,例如加上:\usepackage{subfigure})
\begin{figure}[htb]
     \centering
     \subfigure[]{
          \begin{minipage}[b]{0.2\textwidth}
               \includegraphics[width=1\textwidth]{FirstFigure.eps}
          \end{minipage}
          \label{FirstFigure}
     }
     \subfigure[]{
          \begin{minipage}[b]{0.2\textwidth}
          \includegraphics[width=1\textwidth]{SecondFigure.eps}
          \end{minipage}
          \label{SecondFigure}
     }
     \subfigure[]{
          \begin{minipage}[b]{0.2\textwidth}
               \includegraphics[width=1\textwidth]{ThirdFigure.eps}
          \end{minipage}
          \label{ThirdFigure}
     }
     \caption{Optical spectrum of (a)BS1, (b)BS2 and (c) Amplified Signal wave.}
\end{figure}

2015年2月15日 星期日

使用LaTeX撰寫期刊論文(MikTeX2.9+TexMaker4.4.1+JabRef2.10+GSview5.0+GPL Ghostscript 9.01)

這裡紀錄了使用LaTeX撰寫期刊論文時的一些注意事項,使用的組合為:

編譯器:MikTeX2.9
編輯器:TexMaker4.4.1
文獻管理工具:JabRef2.10
圖案轉檔工具:GSview5.0+GPL Ghostscript 9.01
  1. 如果在編譯PDF檔時有引入package不存在的問題,通常是沒有下載對應的package,解決方法是下載需要的package,以MikTeX2.9為例,依照程式集-->MikTeX2.9-->Maintenance (Admin)-->Package Manager (Admin)的路徑開啟Package Manager (Admin),在Name的方框中打上需要的package名稱,指到要下載的package按右鍵選擇Install就可以了。
  2. 如果使用MikTeX發現提供package下載的伺服器站點掛掉了,可以在Package Manager (Admin)的Repository--> -->Change Package Repository-->下一步 的路徑中選擇其他的伺服器站點。
  3. 在使用編輯器打好程式碼,要輸出成PDF檔時,可能會出現錯誤無法編譯過(例如有使用到eps的圖時),可以選擇其它的編譯方法試試看,例如XeLaTex。
  4. 使用JabRef2.10可以很好的管理及將文獻引入LaTeX中,通常在各大期刊的各文章頁面中,都會有提供各式的文獻輸出格式,連結通常為Download Citations或Export Citation等字樣,如下圖所示,LaTex使用的文獻為副檔名為bib的BibTex格式:
  5. OpticalInfoBase的BibTeX輸出
    Ieeexplore的BibTex輸出

  6. 使用JabRef2.10做好文獻存成副檔為bib的文獻檔之後,就可以開始在LaTex論文中引