Sliding Menu ျဖင့္ Panels (pages) ေျပာင္းျပျခင္း

Sliding Menu ျဖင့္ Panels (pages) ေျပာင္းျပျခင္း

Sliding Menu ကို အရင္ project မွာ ေရးျပခဲ့ပါၿပီ။ အခု project မွာေတာ့ menu panel ေပၚက button ေတြကို ႏွိပ္လိုက္ရင္ သက္ဆိုင္ရာ panel (page) ေတြကို ေျပာင္းျပႏိုင္ေအာင္ ဖန္တီးပါမယ္။

===========
Views Panel
===========

x1=-50%x
SetTimerInterval(1)
hidden=true

AddPanel("pnlMain",0,0,100%x,100%y,"")
AddLabel("lbl",0,0,100%x,100%y,"pnlMain")

AddPanel("pnlMenu",x1,0,50%x,100%y,"")

SetColor( "pnlMenu",0,cblue)
AddButton("btn1",22,160,266,119,"pnlMenu")
SetText( "btn1","Page 1")

AddButton("btn2",29,310,258,106,"pnlMenu")
SetText( "btn2","Page 2")

AddButton("btn3",36,450,254,117,"pnlMenu")
SetText( "btn3","Page 3")

AddPanel("p1",0,0,100%x,100%y,"pnlMain")
SetColor("p1",0,cGreen)

AddPanel("p2",0,0,100%x,100%y,"pnlMain")
SetColor("p2",0,cYellow)

AddPanel("p3",0,0,100%x,100%y,"pnlMain")
SetColor("p3",0,cRed)

current="p1"
SetVisible("p2",false)
SetVisible("p3",false)

===========
Events Panel
===========
Sub Activity_Pause(UserClosed)
End Sub

Sub Activity_Resume
End Sub

sub activity_keypress(key)
if key=4 then
if hidden=false then
SetTimerEnabled(true)
else
    activityfinish
end if
end if

if key=82 then
SetTimerEnabled(true)
end if
end sub

Sub Timer_Tick

if hidden=true then

x1=x1+10

if x1>=0 then
x1=0
hidden=false
SetTimerEnabled(false )
end if

else

x1=x1-10

if x1<=-50%x then
x1=-50%x
hidden=true
SetTimerEnabled(false)
end if

end if

Setleft("pnlMenu",x1)
Setleft("pnlMain",x1+50%x)

End Sub

Sub Button_Click(Who)

SetTimerEnabled(true)

select Who

case "btn1"
SetVisible(current,false)
SetVisible("p1",true)
current="p1"

case "btn2"
SetVisible(current,false)
SetVisible("p2",true)
current="p2"

case "btn3"
SetVisible(current,false)
SetVisible("p3",true)
current="p3"

end select

End Sub

===========

Slide menu တခု ေရးၾကမယ္

Slide menu တခု ေရးၾကမယ္

phone ရဲ့ menu button ကို ႏွိပ္လိုက္ရင္ menu panel ေလး တခု ဘယ္ဘက္က ေလွ်ာၿပီး ထြက္လာေအာင္ လုပ္ပါမယ္။ menu button ကို ထပ္ႏွိပ္ရင္၊ ဒါမွ မဟုတ္ back button ကို ႏွိပ္လိုက္ရင္၊ menu item တခုကို ႏွိပ္လိုက္ရင္ ျပန္ပိတ္သြားေအာင္ ေရးပါမယ္။ menu panel ထြက္လာခ်ိန္မွာ main panel ကို ညာဘက္ကို တြန္းထုတ္သြားမွာပါ။

========
View Panel
=========
x1=-50%x
SetTimerInterval(1)
hidden=true

AddPanel("pnl1",0,0,100%x,100%y,"")
AddLabel("lbl",0,0,100%x,100%y,"pnl1")
SetText("lbl","This is main activity")

AddPanel("pnl2",x1,0,50%x,100%y,"")

SetColor( "pnl2",0,cblue)
AddButton("btn1",22,160,266,119,"pnl2")
SetText( "btn1","Menu 1")
AddButton("btn2",29,310,258,106,"pnl2")
SetText( "btn2","Menu 2")
AddButton("btn3",36,450,254,117,"pnl2")
SetText( "btn3","Menu 3")

=============
Events Panel
=============

Sub Activity_Pause(UserClosed)
End Sub

Sub Activity_Resume
End Sub

sub activity_keypress(key)
if key=4 then
if hidden=false then
SetTimerEnabled(true)
else
activityfinish
end if
end if

if key=82 then
SetTimerEnabled(true)
end if
end sub

Sub Timer_Tick

if hidden=true then

x1=x1+10

if x1>=0 then
x1=0
hidden=false
SetTimerEnabled(false )
end if

else

x1=x1-10

if x1<=-50%x then
x1=-50%x
hidden=true
SetTimerEnabled(false)
end if

end if

Setleft("pnl2",x1)
Setleft("pnl1",x1+50%x)

End Sub

Sub Button_Click(Who)
MsgBox("Menu Button clicked","")
SetTimerEnabled( true)
End Sub
===========

Animated Button

Animated Button

Button တခုကို color ထည့္လိုက္ရင္ ျဖစ္ျဖစ္၊ background image ထည့္လိုက္ရင္ ျဖစ္ျဖစ္၊ အဲဒီ button ကို click တဲ့အခါ animation မရေတာ့ပဲ ပံုေသႀကီး ျဖစ္သြားပါတယ္။

အခု project မွာ button ကို click လိုက္ခ်ိန္မွာ color ေလး ေျပာင္းျပေအာင္ timer နဲ႔ animate လုပ္ျပထားပါတယ္။

ဒါကို နည္းယူၿပီး color နဲ႔ မဟုတ္ပဲ background image ေလးေျပာင္းျပေအာင္ animate လုပ္ၾကည့္ဖို႔ ေလ့က်င့္ခန္း ေပးလိုက္ပါတယ္။

=========
Views Panel
=========
ColorRelease=cYellow
ColorPress=cGreen
pressedButton=""
SetTimerInterval(100)

AddButton("btn1",10%x,10%y,80%x,10%y,"")
SetColor("btn1",20,ColorRelease)
SetText( "btn1","Click me")

=============
Events Panel
=============
Sub Activity_Pause(UserClosed)
End Sub

Sub Activity_Resume
End Sub

Sub Button_Click(who)

Timer_tick
pressedButton=who
SetTimerEnabled(true )
SetColor(pressedButton,20,ColorPress)

# MsgBox("Button clicked",who)

End Sub

Sub Timer_Tick
SetTimerEnabled( false)
SetColor(pressedButton,20,ColorRelease)
End Sub

=========

ပံုျပင္ (၁၀) ပုဒ္ ပါတဲ့ apk တခု ေရးမယ္

ပံုျပင္ (၁၀) ပုဒ္ ပါတဲ့ apk တခု ေရးမယ္
===========================

ဒီ project က ပံုျပင္ ၁၀ ပုဒ္ ေခါင္းစဥ္ေတြကို listView နဲ႔ ေဖာ္ျပထားၿပီး item တခုကို ေရြးလိုက္ရင္ သက္ဆိုင္ရာ ပံုျပင္ကို ဖတ္လို႔ ရေအာင္ ေရးျပထားပါတယ္။

၁။ ပံုျပင္ေတြကို sample0.txt, sample1.txt, ..., sample10.txt ဆိုၿပီး ေရးသား ဖန္တီးထားပါ။

၂။ အဲဒီ ဖိုင္ေတြကို AddFiles နဲ႔ BMP မွာ ထည့္ပါ။

၃။ ေအာက္က code ေတြကို ေရးပါ။

# Views Panel

SetActivityTitle("Story book")

AddPanel("pnlMain",0,0,100%x,100%y,"")

AddListView("lv1",0,0,100%x,100%y,"pnlMain")

Add("lv1","Story 1")
Add("lv1","Story 2")
Add("lv1","Story 3")
Add("lv1","Story 4")
Add("lv1","Story 5")
Add("lv1","Story 6")
Add("lv1","Story 7")
Add("lv1","Story 8")
Add("lv1","Story 9")
Add("lv1","Story 10")

Reading=false

AddPanel("pnl1",0,0,100%x,100%y,"")
SetVisible("pnl1",false)
AddscrollView("scr1",0,0,100%x,100%y,"pnl1")
getPanel("scr1","pnl2")

Setheight("pnl2",200%y)

# If all Text  not Visible,
# increase height
# eg, Setheight("pnl2",600%y)
# eg, AddLabel ("lbl1",0,0, 100%x, 600%y, "pnl2")

AddLabel("lbl1",0,0,100%x,200%y,"pnl2")

# ##############

# Events Panel

Sub Activity_Pause(UserClosed)
End Sub

Sub Activity_Resume
End Sub

# ###############

sub Activity_keypress(key)

if key=4 then
if Reading=true then

SetVisible("pnl1",false)
SetVisible("pnlMain",true)
Reading=false

else
activityfinish
end if
end if

end sub

# ######################

Sub ListView_ItemClick(who, pos, value)
select pos
case 0
str=FileReadString(DirAssets,"sample0.txt")
case 1
str=FileReadString(DirAssets,"sample1.txt")
case 2
str=FileReadString(DirAssets,"sample2.txt")
case 3
str=FileReadString(DirAssets,"sample3.txt")
case 4
str=FileReadString(DirAssets,"sample4.txt")
case 5
str=FileReadString(DirAssets,"sample5.txt")
case 6
str=FileReadString(DirAssets,"sample6.txt")
case 7
str=FileReadString(DirAssets,"sample7.txt")
case 8
str=FileReadString(DirAssets,"sample8.txt")
case 9
str=FileReadString(DirAssets,"sample9.txt")

end select

SetText("lbl1",str)
SetVisible("pnl1",true)
SetVisible("pnlMain",false)
Reading=true

End Sub

# ###############

၄။ Text ေတြကို အျပည့္ ဖတ္လို႔ မရရင္ pnl2 နဲ႔ lbl1 ရဲ့ height ေတြကို တိုးေပးပါ။

# If all Text  not Visible,
# increase height
# eg, Setheight("pnl2",600%y)
# eg, AddLabel ("lbl1",0,0, 100%x, 600%y, "pnl2")

၅။ ပံုျပင္ မဟုတ္ပဲ အျခား အေၾကာင္းအရာ ေတြကိုလည္း ေရးသားႏိုင္ပါတယ္။

Expandable Buttons

Expandable Buttons

ဒီနမူနာ program ကေတာ့ Button ေတြထဲက တခုကို ႏွိပ္လိုက္ရင္ အဲဒီ button နဲ႔ ဆိုင္တဲ့ information ေတြကို button ေအာက္တည့္တည့္မွာ label တခု ၾကားထိုးၿပီး ေဖာ္ျပတဲ့နည္း ျဖစ္ပါတယ္။

===========
Views Panel
===========

AddPanel("pnl1",0,0,100%x,100%y,"")

AddscrollView("scr1", 0,0,100%x,100%y ,"pnl1")
getPanel("scr1","pnl2")

AddButton("btn1",0,0,100%x,25%y,"pnl2")
SetText("btn1","Button 1")
AddButton("btn2", 0,25%y,100%x,25%y,"pnl2")
SetText("btn2","Button 2")
AddButton("btn3", 0,50%y,100%x,25%y,"pnl2")
SetText("btn3","Button 3")
AddButton("btn4", 0,75%y,100%x,25%y,"pnl2")
SetText("btn4","Button 4")

# Info Label to Show when Button clicked

AddLabel("lbl1", 0,0,100%x,25%y,"pnl2")
SetVisible("lbl1",false )

# initial Settings

Setheight("pnl2",100%y)

stateOpen=0

# informations

info1="info when butt 1 is pressed"
info2="info when butt 2 is pressed"
info3="info when butt 3 is pressed"
info4="info when butt 4 is pressed"

===========
Events Panel
===========
Sub Activity_Pause(UserClosed)
End Sub

Sub Activity_Resume
End Sub

# ###################
Sub Button_Click(Who)

select who

case "btn1"

if stateOpen=1 then

stateOpen=0
displayInfo(0)

else

stateOpen=1
displayInfo(1)

end if

case "btn2"
if stateOpen=2 then

stateOpen=0
displayInfo(0)

else

stateOpen=2
displayInfo(2)

end if

case "btn3"
if stateOpen=3 then

stateOpen=0
displayInfo(0)

else

stateOpen=3
displayInfo(3)

end if

case "btn4"
if stateOpen=4 then

stateOpen=0
displayInfo(0)

else

stateOpen=4
displayInfo(4)

end if

end select
End Sub

# ###############

sub displayInfo(n)

select n

case 0

Setheight("pnl2",100%y)
Settop("btn2",25%y)
Settop("btn3",50%y)
Settop("btn4",75%y)
SetVisible("lbl1",false)

case 1

Setheight("pnl2",125%y)
Settop("lbl1",25%y)
Settop("btn2",50%y)
Settop("btn3",75%y)
Settop("btn4",100%y)
SetVisible("lbl1",true)
SetText("lbl1",info1)

case 2

Setheight("pnl2",125%y)
Settop("lbl1",50%y)
Settop("btn2",25%y)
Settop("btn3",75%y)
Settop("btn4",100%y)
SetVisible("lbl1",true)
SetText("lbl1",info2)

case 3

Setheight("pnl2",125%y)
Settop("lbl1",75%y)
Settop("btn2",25%y)
Settop("btn3",50%y)
Settop("btn4",100%y)
SetVisible("lbl1",true)
SetText("lbl1",info3)

case 4

Setheight("pnl2",125%y)
Settop("lbl1",100%y)
Settop("btn2",25%y)
Settop("btn3",50%y)
Settop("btn4",75%y)
SetVisible("lbl1",true)
SetText("lbl1",info4)

end select

end sub

# ##########

Music Player

Music Player တခု ေရးၾကမယ္

သီခ်င္း ၁၀ ပုဒ္ပါတဲ့ Music Player တခု ေရးပါမယ္။ ကိုယ္ထည့္မဲ့ music file ေတြကို ရိုးရွင္းတဲ့ english name ေျပာင္းထားပါ။ ၿပီးရင္ BMP AddFiles ကေန add လုပ္ထားပါ။ အခု နမူနာမွာေတာ့ music1.mp3 ... music10.mp3 ျဖစ္ပါတယ္။ music ဖိုင္ကို ေရြးခ်ယ္ဖို႔ listView ကို သံုးပါမယ္။ play, pause, stop အတြက္ button ၃ခု သံုးထားပါတယ္။ listView မွာ သီခ်င္း ေရြးလိုက္ရင္၊ play/pause/stop ႏွိပ္ရင္ ထိပ္ဆံုးက label မွာ info display လုပ္မွာပါ။

Version 2.0 မွာ တပုဒ္ခ်င္း ပဲ play လုပ္ႏိုင္ပါဦးမယ္။ version 2.1  က်မွ playlist ကို ဆက္တိုက္ play ႏိုင္မွာပါ။

=============
Views Panel
=============

AddLabel("lbl1",0,97,719,225,"")
SetText("lbl1","music1.mp3 : Stopped")

AddListView("lv1",0,340,720,628,"")

AddButton("btn1",19,988,210,118,"")
SetText("btn1","Play")
AddButton("btn2",268,990,212,114,"")
SetText("btn2","Pause")
AddButton("btn3",506,991,203,111,"")
SetText("btn3","Stop")

FileCopy(DirAssets,"music1.mp3",DirStorage,"music1.mp3")
Add("lv1","music1.mp3")

FileCopy(DirAssets,"music2.mp3",DirStorage,"music2.mp3")
Add("lv1","music2.mp3")

FileCopy(DirAssets,"music3.mp3",DirStorage,"music3.mp3")
Add("lv1","music3.mp3")

FileCopy(DirAssets,"music4.mp3",DirStorage,"music4.mp3")
Add("lv1","music4.mp3")

FileCopy(DirAssets,"music5.mp3",DirStorage,"music5.mp3")
Add("lv1","music5.mp3")

FileCopy(DirAssets,"music6.mp3",DirStorage,"music6.mp3")
Add("lv1","music6.mp3")

FileCopy(DirAssets,"music7.mp3",DirStorage,"music7.mp3")
Add("lv1","music7.mp3")

FileCopy(DirAssets,"music8.mp3",DirStorage,"music8.mp3")
Add("lv1","music8.mp3")

FileCopy(DirAssets,"music9.mp3",DirStorage,"music9.mp3")
Add("lv1","music9.mp3")

FileCopy(DirAssets,"music10.mp3",DirStorage,"music10.mp3")
Add("lv1","music10.mp3")

LoadAudioFile(DirStorage,"music1.mp3")
song="music1.mp3"

============
Events Panel
============
Sub Activity_Pause(UserClosed)
pauseaudio
SetText("lbl1",song & " : Paused")
End Sub

Sub Activity_Resume
End Sub

Sub ListView_ItemClick(who, pos, value)
stopaudio
song=value
LoadAudioFile(DirStorage,song)
SetText("lbl1",song & " : Playing")
playaudio
End Sub

Sub Button_Click(Who)
select who
case "btn1"
playaudio
SetText("lbl1",song & " : Playing ...")
case "btn2"
pauseaudio
SetText("lbl1",song & " : Paused")
case "btn3"
SetText("lbl1",song & " : Stopped")
stopaudio
end select
End Sub

==============

Text File Reader

Text File Reader တခု ေရးၾကမယ္

===============
Views Panel
===============

AddPanel("pnlMain",0,0,100%x,100%y,"")
AddButton("btn1",10%x,10%y,80%x,10%y,"pnlMain")
SetText("btn1","Read Text File")
Reading=false

AddPanel("pnl1",0,0,100%x,100%y,"")
SetVisible("pnl1",false)
AddscrollView("scr1",0,0,100%x,100%y,"pnl1")
getPanel("scr1","pnl2")
Setheight("pnl2",200%y)
AddLabel("lbl1",0,0,100%x,200%y,"pnl2")

===============
Events Panel
===============
Sub Activity_Pause(UserClosed)
End Sub

Sub Activity_Resume
End Sub

Sub Button_Click(Who)

str=FileReadString(FileDirRootExternal,"sample.txt")
SetText("lbl1",str)
SetVisible("pnl1",true)
SetVisible("pnlMain",false)
Reading=true

End Sub

sub Activity_keypress(key)

if key=4 then
if Reading=true then

SetVisible("pnl1",false)
SetVisible("pnlMain",true)
Reading=false

else
activityfinish
end if
end if

end sub

===============