游戏蛮牛学习群(纯技术交流,不闲聊):159852603
游戏蛮牛 手机端
开启辅助访问
 找回密码
 注册帐号

扫一扫,访问微社区

开发者专栏

关注:2355

当前位置:游戏蛮牛 技术专区 开发者专栏

__________________________________________________________________________________
开发者干货区版块规则:

  1、文章必须是图文形式。(至少2幅图)
      2、文章字数必须保持在1500字节以上。(编辑器右下角有字数检查)
      3、本版块只支持在游戏蛮牛原创首发,不支持转载。
      4、本版块回复不得无意义,如:顶、呵呵、不错......【真的会扣分的哦】
      5、......
__________________________________________________________________________________
查看: 656|回复: 11

[士郎] [小技巧]简易 2D 地图制作工具

[复制链接]  [移动端链接]
排名
3
昨日变化

6981

主题

7506

帖子

2万

积分

Rank: 16

UID
1231
好友
185
蛮牛币
10503
威望
30
注册时间
2013-7-29
在线时间
3588 小时
最后登录
2018-11-20

社区QQ达人活力之星原创精华达人突出贡献奖财富之证游戏蛮牛QQ群会员蛮牛妹VIP

发表于 2018-10-31 15:56:01 | 显示全部楼层 |阅读模式

马上注册,结交更多好友,享用更多功能,让你轻松玩转社区。

您需要 登录 才可以下载或查看,没有帐号?注册帐号

x
一、前言
作为 2D 游戏开发者,制作游戏地图是一个必不可少的环节,这篇文章将通过非常简单的方式,在非常短的时间内自己做一个制作游戏的工具。
同时作为一名初学者,希望通过这种方式对自己学习的只是做一个整理、记录,方便日后回顾,水平有限,能力一般,写的不好或不对的地方希望大家指正。







二、原理
该工具通过读取开发者预制定的图片上的像素颜色值,以不同的颜色值代表不同的游戏对象,在场景中与图片上对应的位置生成相应的游戏对象,来实现地图生成的效果。



三、详细说明
3.1 代码开发
首先,自定义一个类,用于将颜色与 GameObject 对应起来,方便进行配置:

[AppleScript] 纯文本查看 复制代码
[System.Serializable]
public class ColorToPrefab
{
        public Color32 color;
        public GameObject prefab;
}

其次,再定义一个类,用于对用户预制定的图片进行加载与生成相应的地图:
[AppleScript] 纯文本查看 复制代码
public class MapLoader : MonoBehaviour
{
        [SerializeField]
        private string mapName = "";    // 预制定图片的名称

        [SerializeField]
        private ColorToPrefab[] colorToPrefabs;    //  配置颜色与 GameObject 映射列表

        private Dictionary<Color32, GameObject> colorIndex = new Dictionary<Color32, GameObject> ();        // 为加快查询设置的索引字典

        void Start ()
        {
                // 进行地图加载与生成
                LoadMap ();
        }

        private void LoadMap ()
        {
                // 初始化索引表
                InitIndex ();

                // 清空已存在的地图对象
                EmptyMap ();

                // 从 Resources 文件夹中根据预制定图片的名称读取该图片
                Texture2D _texture = Resources.Load (mapName) as Texture2D;

                if (_texture != null) {
                        Debug.Log ("Load texture success!");
                } else {
                        Debug.LogError ("Load texture failed!");
                        return;
                }

                // 从图片中读取所有像素值
                Color32[] _colors = _texture.GetPixels32 ();

                // 遍历所有像素值
                for (int i = 0; i < _texture.width; i++) {
                        for (int j = 0; j < _texture.height; j++) {
                                Color32 _c = _colors [(_texture.width * j) + i];

                                // 当像素值的 Alpha 值为 0 时,说明该处为空,不用处理
                                if (_c.a <= 0)
                                        continue;

                                // 从索引字典中找到该颜色值对应的 GameObject,并在相应的位置上生成
                                if (colorIndex.ContainsKey (_c)) {
                                        GameObject go = Instantiate (colorIndex [_c], new Vector3 (i, j, 0), Quaternion.identity) as GameObject;
                                        go.transform.SetParent (transform);
                                } else {
                                        Debug.LogError ("Wrong Color: " + _c.ToString ());
                                }
                        }
                }
        }

        // 初始化索引字典
        private void InitIndex ()
        {
                for (int i = 0; i < colorToPrefabs.Length; i++) {
                        if (!colorIndex.ContainsKey (colorToPrefabs .color)) {
                                colorIndex.Add (colorToPrefabs .color, colorToPrefabs .prefab);
                        } else {
                                Debug.LogError ("Same Color: " + colorToPrefabs .color.ToString ());
                        }
                }
        }

        // 清空已存在的地图对象
        private void EmptyMap ()
        {
                while (transform.childCount > 0) {
                        Transform _tf = transform.GetChild (0);
                        _tf.SetParent (null);
                        Destroy (_tf.gameObject);
                }
        }
}

整个代码非常简短,理解起来应该不难。
3.2 使用步骤
第一步,设计每种颜色值对应的游戏对象
第二步,根据上述对应关系,使用 PS 或 GIMP 等图像处理软件,制作地图,并将该图片放到项目中的 Resources 目录下,如下图所示:

1.jpg


其中黄色代表金币,黑色代表土地,蓝色代表玩家,红色代表怪物


第三步,在场景中新建一个 Empty GameObject,挂在 MapLoader 脚本,并为其设置好地图的名称和颜色与 GameObject 的对应关系,如下图所示:

2.jpg


第四步,点击 Play,即可看到生成的地图了,由于我的地图图片上有四种颜色,我只制定了 3 个对应关系,因此在 Console 里可以看到报错,如下图所示:


3.jpg

到此,地图生成完毕,非常简单。


四、总结
使用该方法生成地图,由于其原理非常简单,开发成本非常低,不仅适用于程序员,甚至连策划和美术都可以在不进行编码的情况下完成对地图的设计。但相比其他带有 GUI 的地图编辑工具还是逊色了几分,可以在小型项目中进行使用。

知乎@杨睿涵





跟我念“站长妹纸萌萌哒!”我说站长,你说YO!爱你们么么哒~
回复

使用道具 举报

6蛮牛粉丝
1087/1500
排名
4413
昨日变化
3

2

主题

343

帖子

1087

积分

Rank: 6Rank: 6Rank: 6

UID
238701
好友
1
蛮牛币
874
威望
0
注册时间
2017-8-21
在线时间
424 小时
最后登录
2018-11-16
发表于 2018-10-31 16:11:20 | 显示全部楼层
作为一个广西人,在北京吃螺蛳粉还是比较推荐水平有限连锁店

回复 支持 反对

使用道具 举报

5熟悉之中
560/1000
排名
4725
昨日变化
24

0

主题

120

帖子

560

积分

Rank: 5Rank: 5

UID
171160
好友
0
蛮牛币
1482
威望
0
注册时间
2016-9-22
在线时间
146 小时
最后登录
2018-11-20
发表于 2018-11-1 09:04:34 | 显示全部楼层

回复

使用道具 举报

5熟悉之中
574/1000
排名
4413
昨日变化
26

0

主题

121

帖子

574

积分

Rank: 5Rank: 5

UID
264326
好友
0
蛮牛币
787
威望
0
注册时间
2018-1-14
在线时间
133 小时
最后登录
2018-11-20
发表于 2018-11-1 09:36:40 | 显示全部楼层

回复

使用道具 举报

4四处流浪
409/500
排名
5864
昨日变化
1

0

主题

75

帖子

409

积分

Rank: 4

UID
282652
好友
1
蛮牛币
2383
威望
0
注册时间
2018-5-24
在线时间
110 小时
最后登录
2018-11-15

迈向小康

发表于 2018-11-1 10:49:03 | 显示全部楼层
小地图666

回复

使用道具 举报

6蛮牛粉丝
1484/1500
排名
1534
昨日变化
1

0

主题

426

帖子

1484

积分

Rank: 6Rank: 6Rank: 6

UID
87577
好友
0
蛮牛币
4983
威望
0
注册时间
2015-3-31
在线时间
256 小时
最后登录
2018-11-20
发表于 2018-11-1 10:57:05 | 显示全部楼层
too good too strong!

回复 支持 反对

使用道具 举报

5熟悉之中
585/1000
排名
4912
昨日变化
4

1

主题

77

帖子

585

积分

Rank: 5Rank: 5

UID
273353
好友
3
蛮牛币
522
威望
0
注册时间
2018-3-20
在线时间
227 小时
最后登录
2018-11-16
发表于 2018-11-1 11:07:05 | 显示全部楼层
学到了,谢谢楼主大大

回复 支持 反对

使用道具 举报

排名
16816
昨日变化
6

0

主题

2

帖子

56

积分

Rank: 2Rank: 2

UID
277705
好友
0
蛮牛币
89
威望
0
注册时间
2018-4-18
在线时间
17 小时
最后登录
2018-11-16
发表于 2018-11-1 14:05:13 | 显示全部楼层
{:97:}学到了,谢谢楼主大大

回复 支持 反对

使用道具 举报

5熟悉之中
614/1000
排名
6057
昨日变化
38

3

主题

125

帖子

614

积分

Rank: 5Rank: 5

UID
168522
好友
0
蛮牛币
176
威望
0
注册时间
2016-9-14
在线时间
268 小时
最后登录
2018-11-20
发表于 2018-11-1 15:47:40 | 显示全部楼层
阅文收币中。。。

回复

使用道具 举报

3偶尔光临
183/300
排名
9658
昨日变化
4

0

主题

7

帖子

183

积分

Rank: 3Rank: 3Rank: 3

UID
241836
好友
0
蛮牛币
307
威望
0
注册时间
2017-9-6
在线时间
68 小时
最后登录
2018-11-17
发表于 2018-11-1 19:10:40 | 显示全部楼层
不错顶一个~

回复

使用道具 举报

6蛮牛粉丝
1290/1500
排名
3959
昨日变化
15

0

主题

761

帖子

1290

积分

Rank: 6Rank: 6Rank: 6

UID
210390
好友
0
蛮牛币
1548
威望
0
注册时间
2017-3-7
在线时间
173 小时
最后登录
2018-11-19
发表于 2018-11-2 13:42:20 | 显示全部楼层

回复

使用道具 举报

3偶尔光临
272/300
排名
8112
昨日变化
5

1

主题

38

帖子

272

积分

Rank: 3Rank: 3Rank: 3

UID
247796
好友
0
蛮牛币
0
威望
0
注册时间
2017-10-9
在线时间
89 小时
最后登录
2018-11-6
发表于 2018-11-6 13:42:49 | 显示全部楼层
谢谢分享

回复

使用道具 举报

您需要登录后才可以回帖 登录 | 注册帐号

本版积分规则

关闭

站长推荐 上一条 /1 下一条

快速回复 返回顶部 返回列表