动漫东东论坛 » 「东东美化讨论」 » [转]开机画面布局代码详解 , 会做开机画面的人来看最好

87657891 发表于 2008-1-1 23:16

[转]开机画面布局代码详解 , 会做开机画面的人来看最好

RT

因为很多人虽然会做,但是那段代码还是没弄明白

因此看到很多样式差不多的登陆界面
大多都是根据别人做好的模版来的
只是改改图片,和稍微改改原代码
并无太大改善.........



这里找到个非常详细的

代码基本上逐一解说

让人更容易看明白,各个代码标签代表什么,修改的是什么有什么作用

绝对对你有帮助









(2)各元件動作時機及顯示設定部份
這一部份就是登錄界面執行動作的腳本碼,以上面各項元件的定義作基礎,設定整個界面運行時的佈局分配及事件觸發時機.

以下分為三部解說.

<logonframe...>起始,</logonframe>結尾
[color=darkorange]這裡規範整個動作腳本的畫面佈局及分配,以上面定義元件1~5的部份,作動作指定及執行.[/color]

<logonaccount...>起始,</logonaccount>結尾
[color=darkorange]這一段執行腳本碼配合上面定義元件6.7.9部份,對帳戶窗口內的各元件作佈局及指定動作.[/color]

<element resid=passwordpanel...>起始,</element>結束
[color=darkorange]這一段執行腳本碼配合上面定義元件8部份,對帳戶密碼及附屬元件作佈局及指定動作[/color]



下面是這三段腳本碼的個別解說.

<logonframe resid=main sheet=styleref(framess) layout=borderlayout()>

<element sheet=styleref(toppanelss) layout=borderlayout() layoutpos=top height=80rp>[color=orange] #執行時上畫面位於畫面頂端,高度80[/color]
<element layoutpos=bottom height=2rp/> [color=orange]#執行時上畫面分隔線位於上畫面底部,高度2[/color]
</element>

<element sheet=styleref(bottompanelss) layout=borderlayout() layoutpos=bottom> [color=orange]#執行時下畫面位於畫面底部,不設高度,由下方元件判斷[/color]
<element layoutpos=top height=2rp/> [color=orange]#執行時下畫面分隔線位於下畫面頂端,高度2[/color]
<element layout=borderlayout() layoutpos=client> [color=orange]#設定執行下畫面時功能定義的各元件空間距離[/color]
<element layout=borderlayout() layoutpos=left> [color=orange]#安排下面的關機按鍵排列在下畫面的左側[/color]
<button layout=borderlayout() layoutpos=top accessible=true accRole=43 accName=rcstr(11)> [color=orange]#設定關機按鍵為可執行,位在上方,顯示文字[/color]
<element layoutpos=left content=rcbmp(107,3,-1,26rp,26rp,0,0) /> [color=orange]#指定關機按鍵圖片及寬26高26[/color]
<element layoutpos=client margin=rect(2rp,0,0,0)/> [color=orange]#關機文字左方設定2pix空間[/color]
</button>
<button layout=borderlayout() layoutpos=top margin=rect(0,2rp,0,0) accessible=true accRole=43 accName=rcstr(14)> [color=orange]#退出鍵同關機鍵[/color]
<element layoutpos=left content=rcbmp(108,3,-1,26rp,26rp,0,0)/>
<element layoutpos=client margin=rect(2rp,0,0,0)/>
</button>
</element>
<element layoutpos=right content=rcstr(25) width=325rp/> [color=orange]#訊息文字,置於右方,由右算起325pix開始顯示[/color]
</element>
</element>

<element layout=flowlayout(1,3,2,3) layoutpos=client content=rcbmp(100,0,0,219rp,207rp,1,0)> [color=orange]#設定中畫面圖片,磚塊排列置中,寬高度[/color]
<element sheet=styleref(leftpanelss) layout=filllayout() layoutpos=left> [color=orange]#左畫面填充模式,置左[/color]
<element layout=verticalflowlayout(0,3,3,2)> [color=orange]#logo組件垂直排列(指下面的product.help)[/color]
<element contentalign=topright padding=rect(0rp,0rp,20rp,20rp) content=rcbmp(123,3,-1,137,86,0,0) background=rgb(90,126,220)/>
<element contentalign=wrapright width=384rp padding=rect(0rp,0rp,40rp,0rp)/> [color=orange]#登入出訊息由中間算起384開始顯示,並加右方40的空間距離[/color]
</element>
<element layout=verticalflowlayout(0,0,0,2) > [color=orange]#歡迎訊息組件(包括Welcome及陰影)以填充模式(填Welcome文字)垂直排列[/color]
<element layout=filllayout() width=384rp> [color=orange]#填充寬度384[/color]
<element content=rcstr(7)/> [color=orange]#填充文字陰影依字串值7內容顯示(此例為Welcome)[/color]
<element content=rcstr(7)/>
</element>
</element>
</element>

<element sheet=styleref(rightpanelss) layout=borderlayout() layoutpos=left width=384rp> [color=orange]#右畫面以外框模式置左,寬度384[/color]
<element layoutpos=left width=1rp/> [color=orange]#中央分隔置於右畫面左側,寬度1[/color]
<scrollviewer sheet=styleref(scroller) layoutpos=client xscrollable=false margin=rect(26rp,0rp,0rp,0rp)> [color=orange]#帳戶視窗滑桿不需要時不顯示[/color]
<selector sheet=styleref(accountlistss) layout=verticalflowlayout(0,3,3,2)/> [color=orange]#帳戶名單垂直排列[/color]
</scrollviewer>
</element>

</element>

</logonframe>



<logonaccount resid=accountitem layout=filllayout() accessible=true accRole=43> [color=orange]#設定使用者帳戶為可執行[/color]
<element layout=borderlayout() height=80rp> [color=orange]#每個帳戶所佔高度80[/color]
<element layout=borderlayout() layoutpos=top> [color=orange]#帳戶底圖位置[/color]
<element layout=flowlayout(0,2,2) layoutpos=left width=58rp height=58rp> [color=orange]#帳戶頭像底圖寬高[/color]
<element />
</element>
<element layoutpos=top/> [color=orange]#帳戶名稱位置[/color]
<button layoutpos=none/> [color=orange]#使用者系統狀態顯示位置不作設定(依元件定義運行)[/color]
<button layoutpos=none/>
</element>
</element>
</logonaccount>


<element resid=passwordpanel sheet=styleref(passwordpaness) layout=borderlayout() height=80rp> [color=orange]#帳戶密碼組件高度[/color]
<element layout=borderlayout() layoutpos=bottom>
<edit layoutpos=left width=163rp/> [color=orange]#密碼框寬度[/color]
<element layoutpos=left/> [color=orange]#密碼輸入位置[/color]
<button layoutpos=left accessible=true accRole=43 accName= rcstr(100)/> [color=orange]#進入按鍵設置為可執行,按下時顯示字串值100[/color]
<button layoutpos=left accessible=true accRole=43 accName= rcstr(13)/> [color=orange]#密碼提示鍵設置為可執行,按下時顯示字串值13[/color]
</element>
<element layoutpos=bottom content=rcstr(6)/> [color=orange]#密碼框上方文字依字串值6顯示[/color]
</element>



这里只复制过来布局的那一部分
有兴趣的可以去:[url]http://lu.8.blog.163.com/blog/static/4856232006111810627469/[/url]
看看

原创是哪的已经不知道了
网上找出很多
不过这是字比较漂亮的,而且分了颜色,看得更清楚

所以就选他转了

unetbbs 发表于 2008-1-2 18:13

[yct37] [yct37] [yct37]
全是代码呀
要是图解就好了

日高佐菜 发表于 2008-2-7 22:38

挖 终于找到登陆的代码了,收下了[yct72]

查看完整版本: [转]开机画面布局代码详解 , 会做开机画面的人来看最好