小地图的制作(UGUI)

一、创建一个Plane和Cube,调整合适位置,再创建一个Camera,重命名为MiniMapCamera,调整摄像机让其视野朝下,Projection为Orthographic,调整size到合适大小
650) this.width=650;" src="http://s5.51cto.com/wyfs02/M00/7E/DD/wKioL1cLUweiN7OnAAB413UJWJo650.png" title="QQ截图20160411152449.png" alt="wKioL1cLUweiN7OnAAB413UJWJo650.png" onabort="" onblur="" onchange="" onclick="" ondblclick="" onerror="" onfocus="" onkeydown="" onkeypress="" onkeyup="" onmousedown="" onmousemove="" onmouseout="" onmouseover="" onmouseup="" onreset="" onresize="" onselect="" onsubmit="" onunload="" style="padding: 0px; margin: 0px; vertical-align: top; border: none;">
二、创建Renderer Texture重命名为MiniMapTexture,并将MiniMapTexture拖拽至MiniMapCamera的Target Texture下
650) this.width=650;" src="http://s5.51cto.com/wyfs02/M01/7E/DD/wKioL1cLWDvhD3QgAACSErIcQuE833.png" title="QQ截图20160411155115.png" alt="wKioL1cLWDvhD3QgAACSErIcQuE833.png" onabort="" onblur="" onchange="" onclick="" ondblclick="" onerror="" onfocus="" onkeydown="" onkeypress="" onkeyup="" onmousedown="" onmousemove="" onmouseout="" onmouseover="" onmouseup="" onreset="" onresize="" onselect="" onsubmit="" onunload="" style="padding: 0px; margin: 0px; vertical-align: top; border: none;">
三、Create——UI——RawImage,生成Canvas和RawImage,在Canvas下创建一个空对象命名为MiniMap,然后在MiniMap下创建Image重命名为Mask,并添加Mask组件,可修改Source Image为Knob(圆形image)。将RawImage拖拽至Mask下
650) this.width=650;" src="http://s1.51cto.com/wyfs02/M02/7E/E0/wKiom1cLXi6TnBUAAACM3Ihmn7g829.png" title="QQ截图20160411160013.png" alt="wKiom1cLXi6TnBUAAACM3Ihmn7g829.png" onabort="" onblur="" onchange="" onclick="" ondblclick="" onerror="" onfocus="" onkeydown="" onkeypress="" onkeyup="" onmousedown="" onmousemove="" onmouseout="" onmouseover="" onmouseup="" onreset="" onresize="" onselect="" onsubmit="" onunload="" style="padding: 0px; margin: 0px; vertical-align: top; border: none;">
四、将MiniMapTexture拖拽至RawImage的Texture下,如果RawImage位置不和Mask重合,则Reset下位置,至此就可以看到小地图了,将其拖至合适位置
650) this.width=650;" src="http://s4.51cto.com/wyfs02/M01/7E/E0/wKiom1cLXx3ya5qdAACPKKhGH6E182.png" title="QQ截图20160411162344.png" alt="wKiom1cLXx3ya5qdAACPKKhGH6E182.png" onabort="" onblur="" onchange="" onclick="" ondblclick="" onerror="" onfocus="" onkeydown="" onkeypress="" onkeyup="" onmousedown="" onmousemove="" onmouseout="" onmouseover="" onmouseup="" onreset="" onresize="" onselect="" onsubmit="" onunload="" style="padding: 0px; margin: 0px; vertical-align: top; border: none;">
五、为了美观可以在Mask下再新建一个RawImage对象,将其重命名为Border,选择Texture为自己喜欢的图片
650) this.width=650;" src="http://s3.51cto.com/wyfs02/M00/7E/DD/wKioL1cLYuyzB47gAACCoDrozEA120.png" title="QQ截图20160411163658.png" alt="wKioL1cLYuyzB47gAACCoDrozEA120.png" onabort="" onblur="" onchange="" onclick="" ondblclick="" onerror="" onfocus="" onkeydown="" onkeypress="" onkeyup="" onmousedown="" onmousemove="" onmouseout="" onmouseover="" onmouseup="" onreset="" onresize="" onselect="" onsubmit="" onunload="" width="650" style="padding: 0px; margin: 0px; vertical-align: top; border: none;">
六、将PC-2图标拖入主角Cube下,调整PC-2合适位置(PC-2为小地图显示的图标),新建两个层Player和MiniMap,Cube选择Player层,PC-2选择MiniMap层,然后让Main Camera渲染除了MiniMap以外的层,让MiniMapCamera渲染除了Player的层,这样小地图显示的就是PC-2代替主角的图标
下图为PC-2选择MiniMap层,Cube同理
650) this.width=650;" src="http://s1.51cto.com/wyfs02/M02/7E/DE/wKioL1cLaIOgu--BAABE7ZvZIgU233.png" title="QQ截图20160411170048.png" alt="wKioL1cLaIOgu--BAABE7ZvZIgU233.png" onabort="" onblur="" onchange="" onclick="" ondblclick="" onerror="" onfocus="" onkeydown="" onkeypress="" onkeyup="" onmousedown="" onmousemove="" onmouseout="" onmouseover="" onmouseup="" onreset="" onresize="" onselect="" onsubmit="" onunload="" width="650" style="padding: 0px; margin: 0px; vertical-align: top; border: none;">
下图为MiniMapCamera的Culling Mask层的选择,Main Camera同理
650) this.width=650;" src="http://s3.51cto.com/wyfs02/M01/7E/E0/wKiom1cLaLPAY5hNAACpeN4RT1Y523.png" title="QQ截图20160411170430.png" alt="wKiom1cLaLPAY5hNAACpeN4RT1Y523.png" onabort="" onblur="" onchange="" onclick="" ondblclick="" onerror="" onfocus="" onkeydown="" onkeypress="" onkeyup="" onmousedown="" onmousemove="" onmouseout="" onmouseover="" onmouseup="" onreset="" onresize="" onselect="" onsubmit="" onunload="" width="650" style="padding: 0px; margin: 0px; vertical-align: top; border: none;">

你可能感兴趣的:(小地图的制作(UGUI))