bao cao HCI

8/2/2019 bao cao HCI

1/21

1

TRNG I HC BCH KHOA H NI

VIN CNG NGH THNG TIN V TRUYN THNG

Bi tp lnTng tc ngi my

TI:

Xy dng giao din cho ng dng chat trn in thoi

AndroidGio vin hng dn: TS. V ThHng Giang

Sinh vin thc hin: Nguyn nh Mn

H Quang Minh

V ThPhng

L Th Trang

V Th Uyn

Lp HTTT-K52

H Ni-thng 10/2011


2/21


3/21

3

I. Tng quan vtng tc ngi my1. Khi nimTng tc ngi my l tp cc qu trnh, i thoi v cc hnh ng qua ngidng con ngi s dng v tng cc vi my tnh

Vai tr ca htng tc

Nhim v ca htng tc l to ra cc h thng an ton v c tnh tin dng nh cch thng chc nng.

Cc tiu ch chnh cho tnh tin dng ca htng tc

- Tnh d hcTnh d hc l mt c trng quan trng ca mt htng tc. N cho php ngidng thiu kinh nghim c th s dng t hiu qu ti a. Tnh d hc th hin cc im:

o Tnh dono Tnh tng hpo Tnh thn thino Tnh khi quto Tnh nht qun

- Tnh mm doTnh mm do lin quan n nhiu cch m ngi dng v my trao i thng tinvi nhau. C 5 nguyn tc th hin tnh mm do.

o i thoi chngo a lungo Di tr nhim vo Thay tho C nhn ha

- Tnh vng chcNgi dng dng my tnh nhm thc hin mt s cc mc ch trong cng vichoc trong lnh vc nhim v. Tnh vng chc ca mt tng tc bao trm cc ctrng h trvic thc hin thnh cng v khng nh ch. Tnh vng chc th

hin mt s tiu ch sau:


4/21

4

o Tnh quan sto Tnh khi phco Tnh p ngo Tnh tng hp nhim v

2. Cc nguyn tc thit k giao din tng tca. Tnh thm mc th hin cc c im

tng phn cao gia cc thnh phn trn mn hnh Nhm cc thnh phn c cng chc nng nhim v Cho php cc biu din 3D S dng mu sc v ha phi n gin v hiu qu Mt thit k c tnh thm m phi cun ht ngi dng

b. Tnh r rngGiao din phi r rng v mt hin th, thit kcng nh ngngha:

Cc thnh phn hin th Cc chc nng Cc tv vn bn

c. Tnh tng thchNgi s dung: thit k phi thch hp vi nhu cu ngi dng

Nhim v: thit k phi m bo cc lung d liu v chc nng thc hin ngnhim vra, ngi dng khng phi c gng thc hin mt nhim v ra.

Sn phm: ngi dng nhng h thng mi thng l nhng ngi dng ca h thngphin bn c v th sn phm phi c thit ksao cho cc thi quen mong i v s

hiu bit ca ngi dng c vn c p dng.

d. Cu hnhCho php d dng c nhn ha v cung cp khi nim cu hnh c

Nng cao nhy v mt iu khin Khuyn khch ngi dng t tm hiu


5/21

5

e. Tnh nht qunMt h thng phi c nhn thy phn ng thao tc theo cng mt cch trong cngmt ng cnh.

Cng mt thnh phn phi:

C cng din mo C cng tnh nng s dng Hot ng tng t

Cng mt hot ng cng mt kt qu

Chc nng ca cc thnh phn phi cnh

f. Tnh trc tipCung cp cch thc hon thnh nhim v mt cch trc tip:

Cc phng n hon thnh tc nhim phi c cung cp. Phn ng ca vic tc ng ln cc thnh phn ca giao din phi c hin

th.

g. Hiu qu- Ti thiu ha chuyn ng ca tay, mt v cc hot ng iu khin khc

Chuyn i gia cc iu khin h thng phi mm mi v d dng Cc nh hng ch dn phi ngn gn nht c th. Chuyn ng ca mt phi trc din v lin tc (trnh cc di chuyn t

ngt)- D bo nhng mong mun ca ngi dng v nhu cu mi khi c th.

h. Thn thin S dng cc khi nimv ngn ng gn gi vi ngi dng Giao din nn t nhin, bt chc nhng mu hnh vi ca ngi dng

i. Mm do H thng phi nhy vi nhng nhu cu khc nhau ca ngi dng, cho php

thc hin yu cu cc mc vi mt hiu quno da trn

Hiu bit v knng ca ngi dng

Kinh nghim ca ngi dng


6/21

6

Sthch c nhn

Thi quen

iu kin hin ti

j. B qua Dung th v b qua mt s li chung khng trnh khi ca ngi dng D bo li nu c th phng nhng li trm trng. Mi khi c li xut hin, a thng bo v cch gii quyt

k. Khi phc Mt h thng phi cho php

Hy b hoc quay li mt s lnh, thao tc ti thi im trc

Quay li bc mt strc nu c kh khn xy ra.

m bo ngi dng khng bao gib mt kt qu ti trng thi hin ti

l. Trch nhim H thng phi tr li nhanh nhng yu cu ca ngi dng

Cung cp phn hi tcth i vi mi hnh ng ca ngi dng thng qua

Hnh nh

Vn bn

m thanh.

m. n gin Cung cp giao din n gin nht c th.

Mt s cch thc to ra sn gin:

S dng cc menu dng n, ch xut hin khi cn thit.

Hin th cc chc nng chung v cn thit trc tin.

Cung cp cc mc nh.

To cc hnh ng chung, n gin.


7/21

7

n. Trong sut Cho php ngi dng tp trung vo nhim v, trnh tp trung vo cc c ch,cch thc hot ng ca giao din.

Cc cng vic v vic nhc nhcc cng vic trong my tnh phi trong suti vi ngi dng.

Khng c bt ngi dng ngh v cc chi tit k thut ca h thng. Cc suyngh phi hng n nhim v.

o. D hiu, d hc Mt h thng phi d hc v d hiu. Ngi dng phi bit:

What to look at

What to do

When to do it

Where to do it

Why to do it

How to do it

Chui hnh ng, p ng, trnh din v thng tin phi theo trt t c khnngdon c.

II. Xy dng htng tc di ng trn Android1. Gii thiu v Android

Android l hiu hnh in thoi di ng mngun mmin ph do Googlepht trin da trn nn tng ca Linux. Bt k mt hng sn xut phn cng no cng

u c th t do s dng hiu hnh Android cho thitb ca mnh, min l cc thitby p ng c cc tiu chun c bn do Google t ra (c cm ngchm, GPS,3G,...)(Xem thm:Android Compatibility Definition Document)

Cc nh sn xut c th tdo thay i phin bn Android trn my ca mnhmt cch t do m khng cn phi xin php hay tr bt k khon ph no nhngphim bo tnh tng thch ngc (backward compatibility) ca phin bn chring .

Android l nn tng cho thit bdi ng bao gm mt hiu hnh, midwarev mt sng dng cho. B cng c Android SDK cung cp cc cng c v b
http://source.android.com/compatibility/android-2.1-cdd.pdfhttp://source.android.com/compatibility/android-2.1-cdd.pdfhttp://source.android.com/compatibility/android-2.1-cdd.pdfhttp://source.android.com/compatibility/android-2.1-cdd.pdf


8/21

8

th vin cc hm API cn thit pht trin ng dng cho nn tng Android s dngngn ng lp trnh java.

Nhng tnh nng m nn tng Android h tr:

Application framework: Cho php ti s dng v thay th cc thnh phn snc ca Android.

Dalvik virtual macine: My o java c ti u ha cho thit bdi ng.

Intergrated browser: Trnh duyt web tch hp c xy dng da trnWebKit engine.

Optimized graphics: H trbth vin 2D v 3D dvo c t OpenGL ES1.0.

SQLite:DBMS dng lu tr d liu c cu trc.H trcc nh dng media ph bin nh: MPEG4, H.264, MP3, AAC, ARM,

JPG, PNG, GIF.

H trthoi trn nn tng GSM (Ph thuc vi phn cng thit b).

Bluetooth, EDGE, 3G v WiFi (Ph thuc vi phn cng thit b).

Camera, GPS, la bn v cm bin (Ph thuc vi phn cng thit b).

B cng c pht trin ng dng mnh m.

2. Kin trc AndroidLc sau th hin cc thnh phn ca hiu hnh Android:
http://webkit.org/http://webkit.org/


9/21

9

Hnh 1 - M hnh kin trc nn tng Android

a. ApplicationsHiu hnh Android tch hp sn mt sng dng c bn nh email client,

SMS, lch in t, bn , trnh duyt web, s lin lc v mt s ng dng khc.Ngoi ra tng ny cng chnh l tng cha cc ng dng c pht trin bng ngnng Java.

b. Application FramworkTng ny ca hiu hnh Android cung cp mt nn tng pht trin ng dng

mqua cho php nh pht trin ng dng c khnng to ra cc ng dng v cngsng to v phong ph. Cc nh pht trin ng dng c t do s dng cc tnh nngcao cp ca thit b phn cng nh: thng tin nh va l, khnng chy dch vdi nn, thit lp ng h bo thc, thm notification vo status bar ca mn hnhthit b

Ngi pht trin ng dng c php s dng y bAPI c dng trongcc ng dng tch hp sn ca Android. Kin trc ng dng ca Android c thit knhm mc ch n gin ha vic ti s dng cc component. Qua bt k ng dng

no cng c th cng bcc tnh nng m n mun chia s cho cc ng dng khc


10/21


11/21

11

SQLite: Mt DBMS nh gn v mnh m.

d. Android RuntimeHiu hnh Android tch hp sn mt tp hp cc th vin ct li cung cp

hu ht cc chc nng c sn trong cc th vin li ca ngn ng lp trnh Java. Ming dng ca Android chy trn mt tin trnh ca ring n cng vi mt th hin camy o Dalvik. My o Dalvik thc t l mt bin th ca my o Java c sa i,b sung cc cng nghc trng ca thit bdi ng. N c xy dng vi mc chlm cho cc thit bdi ng c th chy nhiu my o mt cch hiu qu. Trc khithc thi, bt k ng dng Android no cng c convert thnh file thc thi vi nhdng nn Dalvik Executable (.dex). nh dng ny c thit k ph hp vi ccthit b hn ch v b nhcng nh tc x l. Ngoi ra my o Dalvik s dng bnhn Linux cung cp cc tnh nng nh thread, low-level memory management.

e. Linux KernelHiu hnh Android c xy dng trn b nhn Linux 2.6 cho nhng dch

v h thng ct li nh: security, memory management, process management,network stack, driver model. B nhn ny lm nhim vnh mt lp trung gian ktni phn cng thit b v phn ng dng.

Di y l m hinh hp tc gia my o Dalvik v Navite code:

Hnh 2 - M hnh hp tc gia my o Dalvik v Navite code

JNI: Java Native Interface (Tng t khi nim Application ProgrammingInterface).

Java Native Interface: l mt b framework cho php m lnh vit bng Javachy trn my o java c th gi hoc c gi bi mt ng dng vit bng native


12/21

12

code (ng dng c vit cho mt phn cng c th v trn mt hiu hnh c th)hoc nhng bth vin vit bng C, C++ hoc Assembly.

Bng cch s dng JNI, Android cho php cc ng dng chy trn my oDalvik c th s dng nhng phng thc c vit bng cc ngn ng cp thp nh:C, C++, Assembly. Qua cc nh pht trin ng dng c th xy dng ng dng datrn cc bth vin vit bng C, C++, Assembly nhm tng tc thc thi ca ngdng hoc s dng nhng tnh nng mc thp m ngn ng Java khng h tr. Tuynhin ngi pht trin ng dng cn phi cn nhc sgia tng phc tp ca ngdng khi quyt nh s dng cc bth vin ny.

3. Cc phng tin tng tc ca in thoi AndroidCc thit b thu thp thng tin:

Bn phm: thc hin cc chc nng nhp vn bn, v nhm nt iu khin Mic: thu nhn cc thng tin d liu m thanh Camera: thu nhn cc thng tin d liu hnh nh Mn hnh cm ng: vi s pht trin v cng ngh ny gip vic giao tip

vs my in thoi trnn v cng trc quan v sinh ng. Cng gip chocc phn mm trn in thoi Android c ths dng c d dng.

Cc thit b xut thng tin:

Loa: pht ra cc d liu m thanh Mn hnh: hin ln cc d liu hnh nh, text,

4. Cc thnh phn h trca Android thit k giao din tng tcMt ng dng Android gm cc thnh phn:

Activity Intent Service Content Provider View Lu tr d liu

Trong View l thnh phn c bn xy dng giao din ngi dng cho 1ng dng Android. View l 1 lp cn bn ca widgets (widgets c dng to ccnt nhn, text fields,...).

Lp con ViewGroup l lp cn bn ca layouts, c thcoi nh 1 ci hp vhnh cha nhiu Views hay ViewGroups khc v xc nh cc thuc tnh layout.


13/21

13

Sdng Views:

Trong 1 ca s mn hnh, mi views u c sp xp theo th t trn 1 cytrong 1 hay nhiu file XML nm trong res/layout.

Khi to 1 cy cha cc views, ngi lp trnh cn xc nh nhng gi tr sau:Cc thuc tnh - Chng hn nh xem 1 TextView s hin th ch g. Mi view

c nhng thuc tnh v phng thc khc nhau.

Mc tp trung (Focus) - Thay i s tp trung tu theo input ca ngidng vi requestFocus().

Listeners - nh cc listeners c hnh ng khi 1 s kin g xy ra visetOnFocusChangeListener(View.OnFocusChangeListener)

Nhn thy hay khng - vi setVisibility(int)

Hnh 3 - V d 1 cy Views

Mt sViews thng dng:

TextView: Hin th1 khung text v cho php ngi dng thay i.

ImageView: Hin th 1 hnh nh xc nh t file ti nguyn hay qua 1 content

provider.

Button: Hin th 1 nt nhn.

Checkbox: Hin th 1 nt nhn vi 2 trng thi khc nhau.

KeyboardView: Hin th bn phm o nhp liu.

WebView: Hin th cc trang web bng Webkit.

Mt sViewGroups thng dng:

LinearLayout:Cc view c xp theo 1 hng hay 1 ct duy nht.


14/21

14

Hnh 4 - LinearLayout

AbsoluteLayout:Cho php xc nh chnh xc v tr ca tng view.

Hnh 5 - AbsoluteLayout

TableLayout: Sp xp cc view theo cc ct v hng. Mi hng c th cnhiu view, m mi view s to nn 1 .


15/21

15

Hnh 6 - TableLayout

RelativeLayout: Cho php xc nh v tr cc view theo mi quan h giachng (VD; canh tri, phi,...)

Hnh 7 - RelativeLayout

FrameLayout:L 1 placeholder cho php t ln 1 view duy nht. View

t ln FrameLayout lun c canh l tri pha trn.


16/21

16

Hnh 8 - FrameLayout

ScrollView:L 1 FrameLayout c bit cho php trt (scroll) 1 danh sch dihn kch thc mn hnh.

Hnh 9 - ScrollView

5. Thit k giao din phn mm chat trn in thoi Androida. Tng quan h thng ChatTr chuyn trc tuyn hay cn gi l chat, ngy nay trthnh mt trongnhng hot ng khng th thiu ca ngi dng my tnh. N gip kt ninhng con ngi cch nhau rt xa v mt a l nhng vn c th cng trchuyn, chia s, tm tnh v cng cho cc doanh nghip t chc hi tho, hphnh qua mng Internet.


17/21

17

c thchat, ngi dng phi s dng cc phn mm chat (cn gi l phnmm nhn tin nhanh - IM vit tt ca Instant Messenger). Nu chn ng mtchng trnh chat hp vi nhu cu ca mnh, bn s tit kim c rt nhiuthi gian, ng thi lm c rt nhiu vic c ch.

Thng thng mt phn mm chat (IM) cn c cc chc nng chnh:

To ti khon s dng Login Xem danh sch bn b Tr chuyn (chat) Thm bn vo danh sch bn

b. Chat trn in thoia) Tm hiu yu cu ngi dng

Mt phn mm chat chy trn in thoi n gin d s dng Min ph C khnng trao i d diu v hnh nh H trVideo call C khnng kt ni vi ti khon Facebook Trgip Check mail

b) Phn tch yu cu ngi dngVi cc yu cu u tin, th hai v thba: y l cc yu cu c bn v phithc hin c.

Vi cc yu cu cn li: y u l cc tin ch rt tt cho mt phn mm chat.Tuy nhin do iu kin v thi gian v tin bc ca nhm pht trin th n s rt

kh p ng c.

V vy phn mm s ch thc hin nhng chc nng c bn ca mt chngtrnh chat (IM).

c. AndroidChatTng quan:

Hiu hnh : Android 2.3.3 trln Cng c : Eclipse


18/21

18

Ngn ng : JavaGiao din ng nhp:

Giao din To ti khon s dng mi:


19/21

19

Giao din Xem danh sch bn b:

Giao din Tr chuyn:


20/21

20

Giao din Thm bn vo danh sch bn:

Giao din Menu

6. nh giTnh thm m: c giao din vi mu sc kh hi ha du mt, n gin vhiu qu. Tuy nhin cng c phn hi n iu.


21/21

21

Tnh r rng: cc giao din u r rng v chc nng cng nh vn bn.

Tnh tng thch: tng thch vi tt ccc my in thoi Android 2.3.3 trln, v hon ton d s dng.

Cu hnh:cha cho php ngi dng c nhn ha.

Tnh nht qun: tt

Tnh trc tip: tt

Hiu qu: trong mc chp nhn c

Thn thin: s dng ting Anh n gin, thao tc d dng

Tnh mm do: htng tc cn cng nhc cha mm do

B qua: c thng bo khi ngi dng mc li v cch gii quyt

Khi phc:cho php ngi dng tin ti hoc li li trong mt s qu trnh

Trch nhim: phn hi nhanh chng cc yu cu ca ngi dng

n gin: giao din n gin d nhn

Trong sut: ttD hiu dc: tt, c gi gip d dng hiu

7. Ti liu tham kho1. http://developer.android.com/index.html2. Slide bi ging trn lp3.

google.com4. http://vietandroid.com
http://developer.android.com/index.htmlhttp://developer.android.com/index.htmlhttp://vietandroid.com/http://vietandroid.com/http://vietandroid.com/http://developer.android.com/index.html

Documents

bao cao HCI