Unity3d学习笔记（8）-- 可展开公告牌

模仿这个网站制造一个可展开的公告牌 http://www.tasharen.com/ngui/example9.html（PS：请用ie打开）

一.首先上个最终的效果图：

二.首先创建一个ScollView，然后给Content添加一个VerticalLayoutGroup组件，并为Content创建三个Button和Text子对象，并把每个Button的Transition设为None，结果如下图所示：

              

三.给Canvas添加一个Image的组件，把公告牌的背景图片放上去（左图），还要给ScrollView加上一张背景（右图）

              

顺便提一下怎么把一张图片转化为Sprite，点击图片，把TextureType设置为Sprite（2D and UI）：

四.之后设置一下ScrollView的Anchors

五.之后要弄的是设置各个Button的图片和ScrollBar的图片，颜色和设置各个Text（包括Button的Text）的内容，之后你可能

会发现文本不能全部显示和滚动条没能出现之类的问题，这是只要设置Text的高度和Content的高度就可以了，如果以上步骤都没问题的话，应该和下图差不多：

好了，到了这里，布局就完成了，剩下的就是点击button时，文本折叠起来和展开。

六.我这里是通过旋转文本和改变文本的高度来实现的，先看下代码

IEnumerator rotateIn()
    {
        float rx = 0;
        float xy = 120;
        for (int i = 0; i < frame; i++)
        {
            rx -= 90f / frame;
            xy -= 120f / frame;
            text.transform.rotation = Quaternion.Euler(rx, 0, 0);
            text.rectTransform.sizeDelta = new Vector2(text.rectTransform.sizeDelta.x, xy);
            if (i == frame - 1)
            {
                text.gameObject.SetActive(false);
            }
            yield return null;
        }
    }

这是折叠的代码，因为刚学到协程，所以是通过协程来实现的，通过每帧来改变文本的角度和文本的高度，来实现折叠的效果，展开的也类似。好了，到了这里，

整个实现也完成了，以下是所有的代码

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI;

public class Bulletin : MonoBehaviour {

    private Button yourButton;
    public Text text;
    private int frame = 20;

    // Use this for initialization
    void Start()
    {
        Button btn = this.gameObject.GetComponent<Button>();
        btn.onClick.AddListener(TaskOnClick);
    }

    IEnumerator rotateIn()
    {
        float rx = 0;
        float xy = 120;
        for (int i = 0; i < frame; i++)
        {
            rx -= 90f / frame;
            xy -= 120f / frame;
            text.transform.rotation = Quaternion.Euler(rx, 0, 0);
            text.rectTransform.sizeDelta = new Vector2(text.rectTransform.sizeDelta.x, xy);
            if (i == frame - 1)
            {
                text.gameObject.SetActive(false);
            }
            yield return null;
        }
    }

    IEnumerator rotateOut()
    {
        float rx = -90;
        float xy = 0;
        for (int i = 0; i < frame; i++)
        {
            rx += 90f / frame;
            xy += 120f / frame;
            text.transform.rotation = Quaternion.Euler(rx, 0, 0);
            text.rectTransform.sizeDelta = new Vector2(text.rectTransform.sizeDelta.x, xy);
            if (i == 0)
            {
                text.gameObject.SetActive(true);
            }
            yield return null;
        }
    }


    void TaskOnClick()
    {
        if (text.gameObject.activeSelf)
        {
            StartCoroutine(rotateIn());
        }
        else
        {
            StartCoroutine(rotateOut());
        }
        
    }
}