1 / 24

Making Your Mobile Apps Sexy Using the Compact Framework 3.5

Making Your Mobile Apps Sexy Using the Compact Framework 3.5. Stephen Leverett DotNetConsult. Compact Framework Controls. Native controls with wrappers Filter unwanted messages Manage events raised Paint events not available Custom drawing not available.

munin
Download Presentation

Making Your Mobile Apps Sexy Using the Compact Framework 3.5

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation Transcript

  1. Making Your Mobile Apps Sexy Using the Compact Framework 3.5 Stephen Leverett DotNetConsult

  2. Compact Framework Controls • Native controls with wrappers • Filter unwanted messages • Manage events raised • Paint events not available • Custom drawing not available

  3. .NET Compact Framework 3.5: Graphics consideration • Support for drawing primitives with fill methods: Line, Polygon, Image, etc... • Alpha Blending pixel by pixel of one color • Form and Control objects support CreateGraphics method • Icons with high resolutions supported (not high-color)

  4. .NET Compact Framework 3.5: Performance considerations • OnPaint with a PaintEventArgs when using an object • Draw graphics to off-screen bitmap • Design drawing with item changes determined by cursor position

  5. Basic Drawing &Graphics features • Set up a Background Image • Zoom effect • Gradient Fill • Draw Image with Transparency • Draw Image Off-Screen

  6. Set up a Background Image • Add a resource to Project • Set “Build Action” under properties to “Embedded Resource” • Generate Resource Stream • Draw Image

  7. Assembly asm = Assembly.GetExecutingAssembly(); Bitmap backgroundImage = new Bitmap(asm.GetManifestResourceStream("BackgroundIMG.Toucan.jpg")); e.Graphics.DrawImage(backgroundImage, this.ClientRectangle, new Rectangle(0, 0, backgroundImage.Width, backgroundImage.Height), GraphicsUnit.Pixel);

  8. Zoom effect • Setup Image • Create Image • Zoom into Image • Draw Normal and Zoom images

  9. void CreateBitmap() { bmp = new Bitmap(75, 75); Graphics g = Graphics.FromImage(bmp); SolidBrushBlueBrush = new SolidBrush(Color.Blue); SolidBrushRedBrush = new SolidBrush(Color.Red); Rectangle OuterRect = new Rectangle(0, 0, 200, 200); g.FillRectangle(BlueBrush, OuterRect); Rectangle InnerRect = new Rectangle(25, 25, 25, 25); g.FillRectangle(RedBrush, InnerRect); g.Dispose(); }

  10. private void ZoomIMG() { bmpZoom = new Bitmap(bmp.Width, bmp.Height); Graphics g = Graphics.FromImage(bmpZoom); int new4W = bmp.Width / 4; int new4H = bmp.Height / 4; int new2W = bmp.Width / 2; int new2H = bmp.Height / 2; Rectangle srcRect = new Rectangle(new4W, new4H, new2W, new2H); Rectangle dstRect = new Rectangle(0, 0, bmpZoom.Width, bmpZoom.Height); g.DrawImage(bmp, dstRect, srcRect, GraphicsUnit.Pixel); } protected override void OnPaint(PaintEventArgs e) { e.Graphics.DrawImage(bmp, 0, 0); e.Graphics.DrawImage(bmpZoom, 125, 0); base.OnPaint(e); }

  11. Gradient Fill • Setup Win32Helper • Setup TRIVERTEX and GradientFill call • Initialize Graphics • Make GadientFill call • DrawImage

  12. public TRIVERTEX( int x, int y, ushort red, ushort green, ushort blue, ushort alpha) { this.x = x; this.y = y; this.Red = (ushort)(red << 8); this.Green = (ushort)(green << 8); this.Blue = (ushort)(blue << 8); this.Alpha = (ushort)(alpha << 8); } public struct GRADIENT_RECT { public uintUpperLeft; public uintLowerRight; public GRADIENT_RECT(uintul, uintlr) { this.UpperLeft = ul; this.LowerRight = lr; } }

  13. [DllImport("coredll.dll", SetLastError = true, EntryPoint = "GradientFill")] public extern static boolGradientFill( IntPtrhdc, TRIVERTEX[] pVertex, uintdwNumVertex, GRADIENT_RECT[] pMesh, uintdwNumMesh, uintdwMode); public const int GRADIENT_FILL_RECT_H = 0x00000000; public const int GRADIENT_FILL_RECT_V = 0x00000001;

  14. Win32Helper.TRIVERTEX[] tva = new Win32Helper.TRIVERTEX[2]; tva[0] = new Win32Helper.TRIVERTEX(r.X, r.Y, startColor); tva[1] = new Win32Helper.TRIVERTEX(r.Right, r.Bottom, endColor); Win32Helper.GRADIENT_RECT[] gr = new Win32Helper.GRADIENT_RECT[] { new Win32Helper.GRADIENT_RECT(0, 1)}; // Get the handle from the Graphics object. IntPtrhdc = g.GetHdc(); // PInvoke to GradientFill. bool b; b = Win32Helper.GradientFill( hdc, tva, (uint)tva.Length, gr, (uint)gr.Length, (uint)fillDirection); System.Diagnostics.Debug.Assert(b, string.Format( "GradientFill failed: {0}", System.Runtime.InteropServices.Marshal.GetLastWin32Error()));

  15. Color Topcolor = Color.Red; Color BottomColor = Color.RoyalBlue; Bitmap bmp = new Bitmap(Width, Height); Graphics g = System.Drawing.Graphics.FromImage(bmp); GradientFill.Fill(g, this.ClientRectangle, Topcolor, BottomColor, GradientFill.FillDirection.TopToBottom); //Draw Graphic Image e.Graphics.DrawImage(bmp, 0, 0); g.Dispose(); bmp.Dispose();

  16. Draw Image with Transparency • Setup BitMap and Graphics • Fill part of Graphics with Red(Black background) • ImageAttributes color set • Setup Image and DrawImage

  17. Bitmap bmp = new Bitmap(200, 200); Graphics g = Graphics.FromImage(bmp); g.FillEllipse(new SolidBrush(Color.Red), 0, 0, bmp.Width, bmp.Width); g.Dispose(); ImageAttributesattr = new ImageAttributes(); attr.SetColorKey(Color.Black, Color.Black); Rectangle dstRect = new Rectangle(0, 0, bmp.Width, bmp.Height); e.Graphics.DrawImage(bmp, dstRect, 0, 0, bmp.Width, bmp.Height, GraphicsUnit.Pixel, attr);

  18. Draw Image off-screen • Setup BitMap and Graphics • Fill Graphics Bitmap with Red • Create white rectangle with Green Circle • Draw the Bitmap onto the screen

  19. Bitmap bmp = new Bitmap(200, 200); SolidBrushGreenBrush = new SolidBrush(Color.DarkSeaGreen); Pen WhitePen = new Pen(Color.White, 3); Graphics g = Graphics.FromImage(bmp); g.FillRectangle(new SolidBrush(Color.Red), 0, 0, bmp.Width, bmp.Height); Rectangle rect = new Rectangle(x, y, 20, 20); g.DrawRectangle(WhitePen, rect); g.FillEllipse(GreenBrush, rect); e.Graphics.DrawImage(bmp, 0, 0, ClientRectangle, GraphicsUnit.Pixel); g.Dispose();

  20. Removing the Title Bar • Set the FormBorderStyle to none • Maximize FormWindowState • Example: this.FormBorderStyle = FormBorderStyle.None; this.WindowState=FormWindowState.Maximized;

  21. Removing Button Bar • Delete MainMenu from Form

  22. Behaviour Variations? • Compact Framework changes from1.0/2.0 to 3.5? Check out article: .NET Compact Framework 3.5 Run-Time Breaking Changes

  23. Articles: • Graphics and Drawing in the .NET Compact Framework http://msdn.microsoft.com/en-us/library/hf85w92t.aspx • How to: Set a Background Image on a Form http://msdn.microsoft.com/en-us/library/ms172529.aspx • How to: Create a Zoom Effect http://msdn.microsoft.com/en-us/library/ms229648.aspx • How to: Display a Gradient Fill http://msdn.microsoft.com/en-us/library/ms229655.aspx • How to: Draw Images with Transparency http://msdn.microsoft.com/en-us/library/ms172507.aspx • How to: Draw Images Off-Screen http://msdn.microsoft.com/en-us/library/ms172506.aspx

  24. Articles(cont.): • How to: Handle Orientation and Resolution Changes http://msdn.microsoft.com/en-us/library/ms229649.aspx • Creating Compelling and Attractive UI’s Webcast http://msevents.microsoft.com/CUI/WebCastEventDetails.aspx?culture=en-US&EventID=1032404297&CountryCode=US • Code for the UI Webcast’s http://code.msdn.microsoft.com/uiframework • Building Graphically Advanced Applications http://expression.microsoft.com/en-us/dd279543.aspx • .NET Compact Framework 3.5 Run-Time Breaking Changes http://msdn.microsoft.com/en-us/netframework/bb986636.aspx

More Related