NGUI CoverFlow(with Reflection Shader)
首先原帖子在这里:
http://game.ceeger.com/forum/read.php?tid=1383
这楼主做得非常好了,我都不知道怎么优化才好,但是本人是厌恶OnGUI主义者,所以决定要把一切OnGUI的东西根除...
然后附加了镜面效果,看着还行,不说那么多先来个图:
下面是NGUI的排布
主要代码,红色为修改的部分
using UnityEngine;
using System.Collections;
using System.Collections.Generic;
public class NGUICoverFlow : MonoBehaviour {
private List<GameObject> photos = new List<GameObject>();
private int photosCount = 5;
private int currentIndex = 0;
private float MARGIN_X = 3f; //plane 之间的间隔
private float ITEM_W = 10f; //plane长宽为10M(10个单位长度)
private float sliderValue = 4f;
public UISlider uiSlider;
void Start()
{
loadImages();
//uiSlider.numberOfSteps = photosCount; //这里可设成Steps模式 随个人喜好
}
void loadImages()
{
for (int i = 0; i < photosCount; i++)
{
GameObject photo = GameObject.CreatePrimitive(PrimitiveType.Plane);
photos.Add(photo);
photo.layer = 14; //我的相片全部作为一个单独的层 这样镜面渲染就好办了
photo.transform.eulerAngles = new Vector3(-90f, 0f, 0f);
photo.transform.localScale = new Vector3(1.5f, 1f, -1f); //根据图片设定长宽比,z:-1,使图正向
photo.renderer.material.mainTexture = Resources.Load("photo" + i.ToString(), typeof(Texture2D)) as Texture2D;
photo.transform.parent = gameObject.transform;
}
moveSlider(photos.Count / 2);
}
void moveSlider(int id)
{
if (currentIndex == id)
return;
currentIndex = id;
for (int i = 0; i < photosCount; i++)
{
float targetX = 0f;
float targetZ = 0f;
float targetRot = 0f;
targetX = MARGIN_X * (i - id);
//left slides
if (i < id)
{
targetX -= ITEM_W * 0.6f;
targetZ = ITEM_W * 3f / 4;
targetRot = -60f;
}
//right slides
else if (i > id)
{
targetX += ITEM_W * 0.6f;
targetZ = ITEM_W * 3f / 4;
targetRot = 60f;
}
else
{
targetX += 0f;
targetZ = 0f;
targetRot = 0f;
}
GameObject photo = photos;
float ys = photo.transform.position.y;
Vector3 ea = photo.transform.eulerAngles;
iTween.MoveTo(photo, new Vector3(targetX, ys, targetZ), 1f);
iTween.RotateTo(photo, new Vector3(ea.x, targetRot, targetZ), 1f);
}
}
public void OnSliderChange(float value)
{
Debug.Log(value);
moveSlider((int)(value * photosCount));
}
}
下面是uiSlider的设置
镜面效果是我从某个网页找到的,请点击看:
http://blog.163.com/lnwanggang@yeah/blog/static/165332162201010611107883/
这个效果写得很好,我就不复制黏贴了,
主要是搞一个shader和一个调用的文件MirrorReflection.cs:其实这两个东西到底什么意思我也没看懂,我会吐槽么反正我是拿来用了
其实感觉不写shader也可以 直接拿FX/Mirror Reflection那个来用
但是那个MirrorReflection.cs是一定要写的
几个参数默认就好了,只有m_ReflectLayers这个设置为picture的层就行了
不过我对比过好像这个多了一句shader语句好像是image效果的意义不明
再自己用ps新建一个64*64的图片
rgb为106,107,106, 整个图片的透明度为40%,然后保存成png放入场景中,作为镜面的材质色
一定要
最后调整一下各个方向的位置和角度,
搞定!~ 自己动手丰衣足食 项目我就不放出来了
'Unity3D > NGUI' 카테고리의 다른 글
[펌] NGUI 쉽게 말풍선 만들기 (0) | 2017.02.03 |
---|---|
[링크] InfiniteList_NGUI (0) | 2016.10.27 |
[Link] Unity-NGUIExtension (0) | 2016.10.10 |
[펌] Smart Localization with NGUI (0) | 2016.09.26 |
[펌] 유니티3D 튜토리얼 - 01 - NGUI로 커버플로우 간단 구현 (0) | 2016.03.23 |