xiangpei001
Flash/Flex构架师 / 广东
积分 0

BitmapText:美术字处理方案


2010-08-28 点击:


游戏开发中..常常需要显示特殊的美术字体..

像经验数字~扣血扣蓝~倒计时等~
像一般的基于字体的美术字~只需要嵌入字体即可~
但像下面这类纯手工的美术字~
art word

处理起来就没有这么方便..

常见的方案一般为截取相应位置的bitmap数据..
然后重新拼成需要的内容..再显示之~

效果如下(可在下方的输出框内输出数字试试):
/UploadTeach/201008/20100802161347727.swf

第一行的数字是不忽略透明空白,第二行则是忽略透明空白,对比一下应该就能明白了。

下面是源码..代码很简单..我就不多说了..

  1. 01.package  
  2. 02.{   
  3. 03.    import flash.display.Bitmap;   
  4. 04.    import flash.display.Sprite;   
  5. 05.    import flash.events.Event;   
  6. 06.    import flash.text.TextField;   
  7. 07.    import flash.text.TextFormat;   
  8. 08.    
  9. 09.    import net.l4cd.display.BitmapText;   
  10. 10.    
  11. 11.    [SWF(backgroundColor="#FFFFFF",width="550",height="200")]   
  12. 12.    
  13. 13.    /**   
  14. 14.     * BitmapTextExample   
  15. 15.     * @author l4cd   
  16. 16.     * @website http://l4cd.net   
  17. 17.     */  
  18. 18.    public class BitmapTextExample extends Sprite   
  19. 19.    {   
  20. 20.        [Embed(source="number.png")]   
  21. 21.        private var BitmapTextClass:Class;   
  22. 22.    
  23. 23.        private var bt1:BitmapText;   
  24. 24.        private var bt2:BitmapText;   
  25. 25.        public function BitmapTextExample()   
  26. 26.        {   
  27. 27.            //不忽略透明空白   
  28. 28.            bt1 = new BitmapText((new BitmapTextClass as Bitmap).bitmapData,50,50,0,false,"0123456789");  
  29. 29.            addChild(bt1);   
  30. 30.            bt1.x = 20;   
  31. 31.            bt1.y = 10;   
  32. 32.    
  33. 33.            //忽略透明空白   
  34. 34.            bt2 = new BitmapText((new BitmapTextClass as Bitmap).bitmapData,50,50,0,true,"0123456789");  
  35. 35.            addChild(bt2);   
  36. 36.            bt2.x = 20;   
  37. 37.            bt2.y = 80;   
  38. 38.    
  39. 39.            bt1.text = "152443004";   
  40. 40.            bt2.text = "152443004";   
  41. 41.    
  42. 42.            graphics.beginFill(0xCCCCCC);   
  43. 43.            graphics.drawRect(0,150,550,50);   
  44. 44.    
  45. 45.            var txt:TextField = new TextField();   
  46. 46.            txt.defaultTextFormat = new TextFormat("宋体",12);   
  47. 47.            txt.background = true;   
  48. 48.            txt.backgroundColor = 0xFFFFFF;   
  49. 49.            txt.multiline = false;   
  50. 50.            txt.border = true;   
  51. 51.            txt.borderColor = 0xCCCCCC;   
  52. 52.            txt.type = "input";   
  53. 53.            txt.width = 200;   
  54. 54.            txt.height = 16;   
  55. 55.            txt.x = 20;   
  56. 56.            txt.y = 165;   
  57. 57.            txt.restrict = "0-9";   
  58. 58.            txt.text = "152443004";   
  59. 59.            addChild(txt);   
  60. 60.            txt.addEventListener(Event.CHANGE,_txtChanged);   
  61. 61.        }   
  62. 62.    
  63. 63.        private function _txtChanged(e:Event):void  
  64. 64.        {   
  65. 65.            bt1.text = bt2.text = e.target.text;   
  66. 66.        }   
  67. 67.    }   
  68. 68.} 
net.l4cd.display.BitmapText源码:
 
  1. 01.package net.l4cd.display   
  2. 02.{   
  3. 03.    import flash.display.BitmapData;   
  4. 04.    import flash.display.Sprite;   
  5. 05.    import flash.geom.Matrix;   
  6. 06.    import flash.geom.Point;   
  7. 07.    import flash.geom.Rectangle;   
  8. 08.    
  9. 09.    /**   
  10. 10.     * @author l4cd.net   
  11. 11.     * @website http://l4cd.net   
  12. 12.     */  
  13. 13.    public class BitmapText extends Sprite   
  14. 14.    {   
  15. 15.        private var _map:Array;   
  16. 16.        private var _chars:String = "0123456789+-.";   
  17. 17.        private var _bitmapData:BitmapData;   
  18. 18.        private var _height:Number;   
  19. 19.        private var _width:Number;   
  20. 20.        private var _blank:Boolean;   
  21. 21.    
  22. 22.        /**   
  23. 23.         * @param bitmapData    位图的bitmapData对象   
  24. 24.         * @param width         单个字符的宽   
  25. 25.         * @param height        单个字符的高   
  26. 26.         * @param gap           输出的文字间隔   
  27. 27.         * @param blank         是否忽略空白   
  28. 28.         * @param chars         位图的字符集   
  29. 29.         *   
  30. 30.         */  
  31. 31.        public function BitmapText(bitmapData:BitmapData,width:Number,height:Number,gap:Number,blank:Boolean=false,chars:String
  32. "0123456789+-.")   
  33. 32.        {   
  34. 33.            super();   
  35. 34.            _bitmapData = bitmapData.clone();   
  36. 35.            _width = width;   
  37. 36.            _height = height;   
  38. 37.            _blank = blank;   
  39. 38.            _map = [];   
  40. 39.            if(chars)_chars = chars;   
  41. 40.            for(var i:uint=0;i<_chars.length;i++)   
  42. 41.            {   
  43. 42.                var bit:BitmapData = new BitmapData(width,height,true,0);   
  44. 43.                bit.copyPixels(_bitmapData,new Rectangle(i*width,0,width,height),new Point(0,0));  
  45. 44.                var rect:Rectangle = bit.getColorBoundsRect(0xFF000000,0x00000000,false);  
  46. 45.                rectrect.x = rect.x + i*width;   
  47. 46.                _map[_chars.charAt(i)] = rect;   
  48. 47.                bit.dispose();   
  49. 48.            }   
  50. 49.        }   
  51. 50.        private var _text:String;   
  52. 51.        public function get text():String  
  53. 52.        {   
  54. 53.            return _text;   
  55. 54.        }   
  56. 55.        public function set text(value:String):void  
  57. 56.        {   
  58. 57.            _text = value;   
  59. 58.            _draw();   
  60. 59.        }   
  61. 60.    
  62. 61.        private function _draw():void  
  63. 62.        {   
  64. 63.            graphics.clear();   
  65. 64.            var x:Number = 0;   
  66. 65.            for(var i:uint=0;i<text.length;i++)   
  67. 66.            {   
  68. 67.                var char:String = text.charAt(i);   
  69. 68.                var index:int = _chars.indexOf(char);   
  70. 69.                var rect:Rectangle = _map[char];   
  71. 70.                if(!_blank)x+=rect.x%_width;   
  72. 71.                graphics.beginBitmapFill(_bitmapData,new Matrix(1,0,0,1,x-rect.x,0),false);   
  73. 72.                graphics.drawRect(x,rect.y,rect.width,rect.height);   
  74. 73.                x+=rect.width;   
  75. 74.                if(!_blank)x = (i+1)*_width;   
  76. 75.            }   
  77. 76.            graphics.endFill();   
  78. 77.        }   
  79. 78.            
  80. 79.        public function destroy():void  
  81. 80.        {   
  82. 81.            graphics.clear();   
  83. 82.            _map = [];   
  84. 83.            _bitmapData.dispose();   
  85. 84.            _bitmapData = null;   
  86. 85.        }   
  87. 86.    }   
  88. 87.} 

 


    xiangpei001  版权所有
    禁止任何用途(禁止转载、商用和个人使用)


所属分类:技术经验分享

本文标签:BitmapText 美术字

各位正在潜水的同学请注意,有0位无聊人士 在EBIBI附近出没!







    点击我更换图片 看不清
    评论内容 (*必填):

    (Ctrl + Enter 快速提交)