| 以文本方式查看主題 - 曙海教育集團論壇 (http://www.rfoamep.cn/bbs/index.asp) -- Windows Mobile手機開發 (http://www.rfoamep.cn/bbs/list.asp?boardid=48) ---- Windows mobile 開發入門—開發絢麗滑動效果 (http://www.rfoamep.cn/bbs/dispbbs.asp?boardid=48&id=2099) |
| -- 作者：wangxinxin -- 發布時間：2010-12-4 9:38:16 -- Windows mobile 開發入門—開發絢麗滑動效果 前言 在這里制作一個9宮格的小程序，如果超過9個，那么就自動翻頁。翻頁采用劃動實現，并且有慣性作用。 原理 mobile手機里滑動效果主要是原理是支持屏幕的觸摸，當我們按下、松開時系統分別可以捕捉到相應的坐標位置，然后動態的改變布局，從而達到劃動的效果。 圖型button 由于mobile還沒有支持圖片button，所以我們做出一個輔佐類，當按下、彈開時分別使用鋼筆繪制不同的圖片到屏幕。 Code using System; using System.Collections.Generic; using System.Text; using System.Drawing; using System.Windows.Forms; using System.Drawing.Imaging; namespace iPhoneUI { public class ImageButton { internal Rectangle clientArea; internal Form owner; internal Bitmap image; internal Bitmap imageDown; internal bool pushed = false; internal Point location; internal Point start; internal int h=30,w=30; internal bool Enable = false; private double pressTime = Environment.TickCount; internal bool pushedOneTime = false; public string Name {get;set;} public bool IsPressedOneTime { get { return pushedOneTime; } set { pushedOneTime = value; } } public event System.EventHandler Click; public event System.EventHandler DoubleClick; public ImageButton(Form owner,int w,int h) { this.w = w; this.h = h; this.owner = owner; Attach(owner); } public ImageButton(Form owner,Point location) { this.owner = owner; Attach(owner); this.location = location; this.clientArea = new Rectangle(location.X, location.Y, h, w); } public Point Location { set { this.location = value; this.clientArea = new Rectangle(location.X, location.Y, w, h); } get { return location; } } public Bitmap Image { get { return image;} set { image = value; if (image != null) { clientArea = new Rectangle(location.X, location.Y, image.Width, image.Height); } } } public Bitmap ImageDown { get { return imageDown;} set { imageDown = value; } } public bool HitTest(int x, int y) { return clientArea.Contains(x, y); } private void Attach(Form owner) { owner.MouseDown += new MouseEventHandler(owner_MouseDown); owner.MouseUp += new MouseEventHandler(owner_MouseUp); owner.DoubleClick += new EventHandler(owner_DoubleClick); } void owner_DoubleClick(object sender, EventArgs e) { } public virtual void owner_MouseUp(object sender, MouseEventArgs e) { if (!Enable) return; if (pushed) { using (Graphics gx = owner.CreateGraphics()) { this.pushed = false; this.Paint(gx); owner.Invalidate(); } pushed = false; if ((Environment.TickCount - pressTime) < 100) { if (Click != null) Click(this, e); } } // SendMessage(ButtonCode, "Button Pressed"); } public virtual void owner_MouseDown(object sender, MouseEventArgs e) { if (!Enable) return; if (this.HitTest(e.X, e.Y)) { using (Graphics gx = owner.CreateGraphics()) { this.pushed = true; IsPressedOneTime = true; this.Paint(gx); if ((Environment.TickCount - pressTime) < 300) { if (DoubleClick != null) DoubleClick(this, e); } pressTime = Environment.TickCount; } start = new Point(e.X, e.Y); } } public void Paint(Graphics gx) { if (!Enable) return; //gx.Clear(Color.White); ImageAttributes attrib = new ImageAttributes(); Color color = GetTransparentColor(image); attrib.SetColorKey(color, color); if (!pushed || imageDown == null) gx.DrawImage(image, clientArea, 0, 0, clientArea.Width, clientArea.Height, GraphicsUnit.Pixel, attrib); else { gx.DrawImage(imageDown, clientArea, 0, 0, clientArea.Width, clientArea.Height, GraphicsUnit.Pixel, attrib); } Brush b = new SolidBrush(Color.Black); int txtX=clientArea.Location.X; if(Name.Length<5)//右移5個PIX txtX+=5; gx.DrawString(this.Name, owner.Font, b, txtX, clientArea.Bottom); } internal Color GetTransparentColor(Bitmap image) { return image.GetPixel(0, 0); } } } 當mouse按下時，判斷是否在圖像所在的區域內，就執行按下時繪制圖像。并且判斷兩次按下時間小于300毫秒，就認為是雙擊，發出注冊雙擊事件。當mouse彈起時，恢復按前的圖像，并且如果按下時間間隔不超過100毫秒，認為是單擊。 初使化按扭 Code 1<?xml version="1.0" standal?> 2<DocumentElement> 3 <menu> 4 <Name>測試1</Name> 5 6 <path>Chat 46x46.bmp</path> 7 <pressPath>Chat 46x46.bmp</pressPath> 8 </menu> 9 <menu> 10 <Name>測試1a</Name> 11 12 <path>Chat 46x46.bmp</path> 13 <pressPath>Chat 46x46.bmp</pressPath> 14 </menu> 15 <menu> 16 <Name>測試1b</Name> 17 18 <path>lock 46x46.bmp</path> 19 <pressPath>lock 46x46_pressed.bmp</pressPath> 20 </menu> 21 <menu> 22 <Name>測試1c</Name> 23 24 <path>Internet Explorer 46x46.bmp</path> 25 <pressPath>Internet Explorer 46x46_pressed.bmp</pressPath> 26 </menu> 27 <menu> 28 <Name>測試1d</Name> 29 30 <path>Close 46x46.bmp</path> 31 <pressPath>Close 46x46_pressed.bmp</pressPath> 32 </menu> 33 <menu> 34 <Name>測試1e</Name> 35 36 <path>Chat 46x46.bmp</path> 37 <pressPath>Chat 46x46_pressed.bmp</pressPath> 38 </menu> 39 <menu> 40 <Name>測試1f</Name> 41 42 <path>Camera 46x46.bmp</path> 43 <pressPath>Camera 46x46_pressed.bmp</pressPath> 44 </menu> 45 <menu> 46 <Name>測試1g</Name> 47 48 <path>Camera 46x46.bmp</path> 49 <pressPath>Camera 46x46_pressed.bmp</pressPath> 50 </menu> 51 <menu> 52 <Name> 53 測試1h 54 </Name> 55 56 <path>Camera 46x46.bmp</path> 57 <pressPath>Camera 46x46_pressed.bmp</pressPath> 58 </menu> |