Creating EOS MMORPG part 3, inventory, 制造MMORPG第三步,库存

Hello Steemit friends, so this is part 3 of trying to create EOS MMORPG game, so today I have made the inventory where player can collect item after killing monster or cutting tree.

So in Unity the GUI system can do all of that by dragging below GUI object to the game

Canvas -> panel -> image -> button(clone 50 of these)

1. We need to add content size fitter to the image so that later on we can do the vertical scroll bar(set vertical = preferred size)
2. We also need to add grid layout group to the images so that it can arrange the 50 item inside it automatically(constraint fixed column count =4)
3. For the button, we need to add layout element to it so that grid layout group can arrange them properly
4. For the panel, we add scroll rect, then we drag image into it and also vertical scroll car into it so that we can scroll the inventory for more than 50 or 100 item
5. We also need to add mask to the panel to hide image bigger than the panel

After these are done, then I created an array to store all item image, and load the item image to those button based on the array of item i get from the server

I think majority of the work will be preparing image for 100 or few hundred item

thanks for reading

---

大家好，这是第三步尝试做一个MMORPG，通常杀怪后会得到一些物品，然后放入库存

在Unity有一个GUI system可以很快速的完成这一项，先把以下的GUI object拉进游戏

Canvas -> panel -> image -> button(复制５０个)

１。 首先image那边要加content size fitter 才能让这个库存有scroll bar(set vertical = preferred size)
２。然后image那边也要加grid layout group，那样就能自动偏排５０个button的位置(constraint fixed column count =4)
３。button那边要加layout element那样才能被自动偏排
４。Panel那边加scroll rect，把image和scroll bar拉进去，这样的话这个库存就能scroll上和下，可以放５０或１００个item
５。最后panel那边加mask把多出来的image遮盖

这些完成后，我会把图全部放入array，然后再根据服务器给我的资料把相应的图放入对的button

其实呢多工的是要准备１００或几百个item的图

谢谢阅读

  <br /><center><hr/><em>Posted from my blog with <a href='https://wordpress.org/plugins/steempress/'>SteemPress</a> : http://fundurian.vornix.blog/2018/09/25/creating-eos-mmorpg-part-3-inventory-%e5%88%b6%e9%80%a0mmorpg%e7%ac%ac%e4%b8%89%e6%ad%a5%e5%ba%93%e5%ad%98/ </em><hr/></center>