移动终端网页游戏移植研发框架【精灵系统纸娃娃】

这下到了说精灵系统纸娃娃的时候了，在每款RPG游戏中都有类似的实体人物造型在游戏中呈现，当然呈现的方式不同，有可移动的，固定的。一般有两种模式，NPC人物，主角人物等类型，就是精灵系统的衍生，人物主角可移动的情况，和第一人称移动的，在我们这个游戏中，我不探讨人物移动【4方向，8方向】的精灵系统，我们做的是表现形式的NPC人物精灵系统，它拥有的功能就是【左右翻转，动态，说话，战斗】，在canvas android中我们利用到  Bitmap 绘制图像，控制素材的反转效果。

下面先在xml制作布局：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
	android:orientation="vertical" android:layout_width="fill_parent"
	android:layout_height="fill_parent">
	<LinearLayout android:orientation="vertical"
		android:layout_height="180dip" android:layout_width="150dip"
		android:gravity="center">

		<TextView android:layout_height="wrap_content" android:text="npcname"
			android:id="@+id/npcname" 
			style="@style/GameText"
			android:gravity="center"
			android:textColor="#FFCC00"
			android:textSize="11dip"
			android:background="@drawable/js_npc_textbd"
			android:layout_width="wrap_content" />
		<ImageView android:layout_width="150dip" android:id="@+id/npcimg"
			android:layout_height="150dip" />
	</LinearLayout>
</LinearLayout>

定义好之后就开始将NPC制作成精灵控件！

Timer timer = new Timer();
	private int i = 0;
	private int cutnum;
	private String npcname;
	private String npcurl;
	private String npcimgrul;
	private Context context;
	private Bitmap npcbitmap;
	private Boolean npcflag=false;
	private String monsetid;
	public String getMonsetid() {
		return monsetid;
	}

	public void setMonsetid(String monsetid) {
		this.monsetid = monsetid;
	}
	public TextView npcnametext;
	private ArrayList<Bitmap> NpcImgResList;
	public ImageView npcimg;
	NpcBody npcbody = new NpcBody();
	public NpcView(Context context) {
		super(context);
		this.context=context;
	}
	
	public NpcView(Context context, AttributeSet attrs) {
		super(context, attrs);
		this.context=context;
	}
	
	public NpcView(Context context, AttributeSet attrs,String npcname,String npcimgrul,int cutnum,Boolean npcflag,String monsetid) {
		super(context, attrs);
		this.context=context;
		initMonster(npcname, npcimgrul, cutnum,npcflag,monsetid);
	}
	
	private void initMonster(String npcname2, String npcimgrul, int cutnum2,Boolean npcflag,String monsetid) {
		// TODO Auto-generated method stub
		this.npcname=npcname2;
		this.npcimgrul=npcimgrul;
		this.cutnum=cutnum2;
		this.npcflag= npcflag;
		setMonsetid(monsetid);
		forceInflate();
		
	}

	public void initNpc(String npcname,String npcurl,int cutnum) {
		this.npcname=npcname;
		this.npcurl=npcurl;
		this.cutnum=cutnum;
		/*npcbitmap = BitmapFactory.decodeResource(this.getResources(),
				npcimgid);*/
		NpcImgResList =npcbody.getNpcBody(cutnum, npcurl);
		forceInflate();
	}
	
	public void forceInflate() {
		onFinishInflate();
	}
	
	@Override
	protected void onFinishInflate() {
		super.onFinishInflate();
		LayoutInflater li = LayoutInflater.from(getContext());
		li.inflate(R.layout.view_npc, this);
		
		if(npcflag!=true)
		{
		    internalOnFienishinflated();
		}
		else
		{
			internalOnFienishinflated2();
		}
	}
	public LayoutParams lp ;
	
	private void internalOnFienishinflated() {
		npcnametext = (TextView)findViewById(R.id.npcname);
		npcimg =(ImageView)findViewById(R.id.npcimg);
		npcnametext.setText(npcname);

		onplay();
	}
	private void internalOnFienishinflated2() {
		npcnametext = (TextView)findViewById(R.id.npcname);
		npcimg =(ImageView)findViewById(R.id.npcimg);
		npcnametext.setText(npcname);
		if(npcimgrul.length()>0)
		{
		   setMonsterImage(npcimgrul);
		}
	}

	private void setMonsterImage(String faceUrl) {
		LocalCache.getInstance(CacheValue.GameDataPack).useDownloadResource(faceUrl, new Action<CacheResult>() {
			@Override
			public void execute(CacheResult cacheResult) {
				if(cacheResult.isCached()) {
					String path = cacheResult.getCachedPath();
					final Bitmap bm = BitmapCache.Instance.getFileImageOrCache(path);
					TApp.getActivity().runOnUiThread(new Runnable() {
						@Override
						public void run() {
							BitmapDrawable drwawable = new BitmapDrawable(bm);
							npcimg.setBackgroundDrawable(drwawable);	
							
						}
					});
				}
			}
		});
	}

然后利用动画播放的机制，将帧显示出来，这样纸娃娃系统就基本成型了，而且能够动起来了。而且还可以拓展，这个就靠大家发挥了。

下面我贴一下制作成功的精灵系统在地图系统中的显示效果。

这就是我们游戏的城池场景，里面的NPC都是非常精美的。

这个就是我们的练级地图了，这套地图系统是由服务器配置的，怪物的坐标，朝向，动作，对话，都可以在服务器端配置。

游戏群：【45578308】欢迎进群讨论