Unity TouchScript大屏

TouchScript插件简介与下载

在unity中，TouchScript非常适合做展示类大屏幕的多点触控，在AssetStore也是五星好评，还是免费资源,也可以在GitHub上下载对应的TouchScript。接下来就制作简单的大屏展示系统了。

制作步骤

一、确定需求功能
（1）图片可从StreamingAssets文件夹中自动读取
（2）加载出来的图片需要自动循环移动展示于大屏幕中
（3）可实现图片的多人点击放大、全屏拖拽、自动归位等功能
（4）实现图片放大之后大图周围图片缩小并且围绕大图旋转功能
（5）CPU处理、GPU渲染无压力测试优化

二、准备前期素材
（1）下载并导入相应的插件TouchScript
（2）准备LitJson.dll和System.Drawing.dll（文件流数据读取方式）
（3）创建StreamingAssets并且导入需要展示的图片

三、编程实现

制作过程

一、实现从StreamingAssets文件夹中获取所有图片，具体的代码如下：

	List<Texture2D> textureList = new List<Texture2D>();//将获取的图片存于集合中
    int texturelistIndex = 0;

    string texpath; //获取本地图片的文件夹路径(自定义)

    void Start()
    {
   
   
        texpath = Application.streamingAssetsPath + "/testimage";

        StartCoroutine(LoadTextureFromFile());//获取对应文件夹的所有文件
    }

    /// <summary>
    /// 使用协程加载文件夹内所有图片文件
    /// </summary>
    /// <returns></returns>
    IEnumerator LoadTextureFromFile()
    {
   
   
        yield return null;
        List<FileInfo> fileInfos = GetAllFileFrom(texpath);//获取相应文件夹所有的图片文件流数据

        for (int i = 0; i < fileInfos.Count; i++)
        {
   
   
            LoadSingleTexture(fileInfos[i].FullName,fileInfos[i].Name);
        }

    }

    /// <summary>
    /// 将集合里的图片取出赋值到需要显示的RawImgae
    /// </summary>
    /// <returns></returns>
    private Texture2D GetTexture()
    {
   
   
        if (textureList.Count>0)
        {
   
   
            Texture2D newTexture2D = textureList[texturelistIndex];
            texturelistIndex += 1;
            if (texturelistIndex>=textureList.Count)
            {
   
   
                texturelistIndex = 0;
            }
            return newTexture2D;
        }
        else
        {
   
   
            return null;
        }
    }

    /// <summary>
    /// 加载单张本地图片
    /// </summary>
    private void LoadSingleTexture(string imagepath,string imagename) 
    {
   
   
        FileStream filestream = new FileStream(imagepath,FileMode.Open,FileAccess.Read);
        filestream.Seek(0,SeekOrigin.Begin);
        byte[] bytes = new byte[filestream.Length];
        filestream.Read(bytes,0,(int)filestream.Length);
        System.Drawing.Image image = System.Drawing.Image.FromStream(filestream);
        filestream.Close();
        filestream.Dispose();
        filestream = null;

        int imageWidth=image.Width;
        int imageheight=image.Height;

        Texture2D tex2D = new Texture2D(1920,1080);
        tex2D.LoadImage(bytes);
        tex2D.name = imagename;
        textureList.Add(tex2D);

        bytes = null;
        filestream = null;
        image = null;
        tex2D = null;

        Resources.UnloadUnusedAssets();
        GC.Collect();
    }

    /// <summary>
    /// 得到相应文件夹下的所有文件夹内的所有文件的路径
    /// </summary>
    /// <param name="filepath"></param>
    /// <returns></returns>
	private List<FileInfo> GetAllFileFrom(string filepath)
	{
   
   
		List<FileInfo> filesinfolist = new List<FileInfo>();
		DirectoryInfo infoDir = new DirectoryInfo(filepath);
		FileInfo[] filesinfo = infoDir.GetFiles("*", SearchOption.AllDirectories);//获取路径内所有文件信息

        for (int i = 0; i < filesinfo.Length; i++)
        {
   
   
            if (filesinfo[i].Name.Contains(".meta"))
            {
   
   
                continue;
            }
            filesinfolist.Add(filesinfo[i]);
        }
        return filesinfolist;
	}

二、加载出图片，并自动循环移动展示于大屏幕
（1）制作移动图片以及点击之后放大图片的预制体，用于接收从文件夹中获取的texture2D赋值以及展示

（2）首先要确定每次生成一列图片时间、的图片的行列数，以及移动的速度、方向，在此项目中我想使得图片每行移动的速度有一定的参差感，所以1，3，5行为一个速度，2，4，6行为一个速度。设置每次生成1，3，5行图片时间为2秒，2，4，6行图片时间为1.35秒，行列数为8行，移动方向为从左到右移动。
相关的代码如下：

 	int row=8;//图片的行数

    float timer1=0;//计时器
    float timer2=0;//计时器
    float createTime1= 2f;//生成一列图片的时间间隔
    float createTime2= 1.35f;//生成一列图片的时间间隔


	 void FixedUpdate()
    {
   
   
        if (isStartMove)
        {
   
   
            timer1 += Time.deltaTime;
            if (timer1>=createTime1)
            {
   
   
                timer1 = 0;
                GetNewImageItemObjSingleRow();
            }


            timer2 += Time.deltaTime;
            if (timer2 >= createTime2)
            {
   
   
                timer2 = 0;
                GetNewImageItemObjDoubleRow();
            }
        }
    }
    /// <summary>
    ///  //获取单行数小图
    /// </summary>

    public void GetNewImageItemObjSingleRow()
    {
   
   
        for (int i = 0; i < row; i++)
        {
   
   
            if (i%2!=0)
            {
   
   
                GameObject image = GetNewMoveImageItem(startpos - new Vector3(0, (i - 1) * offset_y));
                image.SetActive(true);
                AddImageItemCompomemt(image);
                image.GetComponent<ImageItem>().currentpos = startpos;
                image.GetComponent<ImageItem>().targetTrans = startTran;
                float speed = 2f;
                image.GetComponent<ImageItem>().OnEnter(startpos - new Vector3(0, (i - 1) * offset_y), speed, GetTexture());
            }
        }
    }
    /// <summary>
    /// 获取双行数小图
    /// </summary>
    public void GetNewImageItemObjDoubleRow()
    {
   
   
        for (int i = 0; i < row; i++)
        {
   
   
            if (i % 2 == 0)
            {
   
   
                GameObject image = GetNewMoveImageItem(startpos - new Vector3(0, (i - 1) * offset_y));
                image.SetActive(true);
                AddImageItemCompomemt(image);
                image.GetComponent<ImageItem>().currentpos = startpos;
                image.GetComponent<ImageItem>().targetTrans = startTran;
                float speed = 3f;
                image.GetComponent<ImageItem>().OnEnter(startpos - new Vector3(0, (i - 1) * offset_y), speed, GetTexture());
            }
        }
    }
    
 	/// <summary>
    /// 获取新的移动小图
    /// </summary>
    /// <returns></returns>
    public GameObject GetNewMoveImageItem(Vector3 pos)
    {
   
   
        GameObject newimageItem;
        if (newMoveImageQue.Count > 0)
        {
   
   
            newimageItem = newMoveImageQue.Dequeue();

        }
        else
        {
   
   
            newimageItem = Instantiate(moveImagePrefab, moveImageParent, false);
            newimageItem.transform.localPosition = pos;
        }
        return newimageItem