zoukankan      html  css  js  c++  java
  • StarlingManual:纹理和图片

    贴图

    在最后一节中你可能注意到了,当我们使用Image类的时候我们需要使用贴图对象,但是按钮怎不同,那么贴图纹理和图像之间有什么区别呢?

    一个图片需要一个贴图纹理,就像你数码相机中保存的图像数据一样。你不能但是使用这两者的其中任何一个,你必须为Image对象添加一些纹理贴图数据才能显示一些内容。

    在Starling中,我们可以使用一个Image类。这个类创建的时候需要传递一些图像数据内容。

    // create an image from a texture:
    var texture:Texture = Texture.fromBitmap(new EmbeddedBitmap());
    var image:Image = new Image(texture);
     
    // or do the same in one line:
    var image:Image = Image.fromBitmap(new EmbeddedBitmap());
    

    你可以将每一个贴图纹理都放入到内存当中,当然,如果你需要同时显示更多的内容的话你可以使用不同的Image对象来进行显示。

    使用 texture Atlas

    在以前我们会创建很多贴图纹理,但是一个真正的应用绝对不会这样制作。下面是原因。

    • Starling可以利用GPU批量处理绘制Quad和Image。批量处理时候会根绝不同的需求改变其中都纹理贴图。
    • 在使用GPU纹理贴图的时候。你的图像寛高必须是2的乘方。Starling为你避免了这个限制,但是如果你不这么做的话你会消耗更多的内存和资源。

    通过使用纹理集,你可以避免纹理上的更新纹理贴图和资源超出的限制。所有的纹理贴图全部都放到一个“超级纹理”中,并且Starling中的你可以很容易的使用纹理集,所以你要好好的利用这个功能哦~

    每一个纹理贴图的数据在XML中的描述格式如下:

    <</FONT>TextureAtlas imagePath="atlas.png">
     <</FONT>SubTexture name="moon" x="0" y="0" width="30" height="30"/>;
     <</FONT>SubTexture name="jupiter" x="30" y="0" width="65" height="78"/>;
     ...
    </</FONT>TextureAtlas>;
    

    你不用手动创建纹理集,你可以使用下列工具:

    • TexturePacker 这是一个强大的软件,可以使用GUI或者通过命令行来进行操作。
    • Sparrow Starling的姊妹框架Sparrow有一个简单的工具,你可以下载并且安装使用它

    你现在有一个纹理集,那么你如何使用呢?代码如下:

    // Embed the Atlas XML
    [Embed(source="atlas.xml", mimeType="application/octet-stream")]
    public static const AtlasXml:Class;
     
    // Embed the Atlas Texture:
    [Embed(source="atlas.png")]
    public static const AtlasTexture:Class;
     
    // create atlas
    var texture:Texture = Texture.fromBitmap(new AtlasTexture());
    var xml:XML = XML(new AtlasXml());
    var atlas:TextureAtlas = new TextureAtlas(texture, xml);
     
    // display a sub-texture
    var moonTexture:Texture = atlas.getTexture("moon");
    var moonImage:Image = new Image(moonTexture);
    
  • 相关阅读:
    总结!!!总结!!!
    Beta 总结
    BETA-7
    BETA-6
    BETA-5
    BETA-4
    BETA-3
    华为云-软件产品案例分析
    BETA-2
    BETA-1
  • 原文地址:https://www.cnblogs.com/klh5211314/p/3156613.html
Copyright © 2011-2022 走看看