Unit 高效开发系列 - 第四章 无限循环滑动ScrollView封装
前言
Uinty高效开发系列主要包含一系列的Unity开发实例,主要来源于笔者的一个3D游戏项目和一个手机APP项目,适合利用Unity开发游戏或手机APP场景。
一、无限循环滑动ScrollView封装实现
本例中的无限循环滑动ScrollView性能极佳,资源消耗极少,在Android手机测试滑动很丝滑,反应很灵敏。
1.通过脚本自动创建各种类型ScroolView的Iitem。
点击“Tool"->"IniScence”初始化场景,通过脚本自动创建各种类型ScroolView的Iitem,放置到EditContent备用。
public enum ScrollViewItemTypeEnum
{
SVI_Begin = 0,
SVI_SingleColText,
SVI_SingleBtn,
SVI_SingleColTextWithTip,
SVI_SingleColTextWithOutTip,
SVI_TowColText,
SVI_SingleColInput,
SVI_SingleColDropDown,
SVI_TowColInput,
SVI_ThreeColInput,
SVI_TowColSearchInput,
SVI_ThreeColSearchInput,
SVI_TowColDropDown,
SVI_ThreeColDropDown,
SVI_ThreeColToggle,
SVI_QRCode,
SVI_BUTT
}
public static Dictionary<ScrollViewItemTypeEnum, ItemInfo> g_ItemInfoDic = new Dictionary<ScrollViewItemTypeEnum, ItemInfo>()
{
{
ScrollViewItemTypeEnum.SVI_QRCode,
new ItemInfo(ScrollViewItemTypeEnum.SVI_QRCode,new List<object>()
{
new BgObj("BG/BG_993_1600_13"),
new SplitSpanObj(15, PixOrScaEnum.Pixel),
new QRCodeObj("xxfw",new Vector3(1f,3.0f,1.0f),new Vector3(0f,3.0f,0f)),
new SplitSpanObj(15, PixOrScaEnum.Pixel),
})
},
{
ScrollViewItemTypeEnum.SVI_SingleBtn,
new ItemInfo(ScrollViewItemTypeEnum.SVI_SingleBtn,new List<object>()
{
new BgObj("All/ItemBG"),
new FixWithBgObj("SVI_SingleBtn","All/TiJiao","BtnClickPro:SubmitBtnClick"),
new HiddenTextObj("info",""),
})
},
{
ScrollViewItemTypeEnum.SVI_SingleColText,
new ItemInfo(ScrollViewItemTypeEnum.SVI_SingleColText,new List<object>()
{
new BgObj("All/ItemBG"),
new SplitSpanObj(30, PixOrScaEnum.Pixel),
new TextObj("Tip","Tip:",new Vector3(0.5f,1.7f,7.8f),new Vector3(1.0f,8.0f,1.0f),1.5f*1.5f,"Arial",45,new Color(0.4f,0.0f,0.5f), TextAnchor.MiddleLeft),
new SplitSpanObj(30, PixOrScaEnum.Pixel),
})
},
{
ScrollViewItemTypeEnum.SVI_SingleColTextWithTip,
new ItemInfo(ScrollViewItemTypeEnum.SVI_SingleColTextWithTip,new List<object>()
{
new BgObj("All/ItemBG"),
new SplitSpanObj(30, PixOrScaEnum.Pixel),
new TextObj("Tip","Tip:",new Vector3(0.5f,1.7f,7.8f),new Vector3(1.0f,8.0f,1.0f),1.5f*1.5f,"Arial",45,new Color(0.4f,0.0f,0.5f), TextAnchor.MiddleLeft),
new TextObj("Info","",new Vector3(2.2f,7.3f,0.5f),new Vector3(1.0f,8.0f,1.0f),6.5f*1.6f,"Arial",45,new Color(0.4f,0.0f,0.5f), TextAnchor.MiddleLeft),
new SplitSpanObj(30, PixOrScaEnum.Pixel),
})
},
{
ScrollViewItemTypeEnum.SVI_SingleColTextWithOutTip,
new ItemInfo(ScrollViewItemTypeEnum.SVI_SingleColTextWithOutTip,new List<object>()
{
new BgObj("All/ItemBG"),
new SplitSpanObj(30, PixOrScaEnum.Pixel),
new TextObj("TextInfo","",new Vector3(0.5f,9f,0.5f),new Vector3(1f,8f,1f),10f,"Arial",45,new Color(0.4f,0.0f,0.5f), TextAnchor.MiddleLeft),
new SplitSpanObj(30, PixOrScaEnum.Pixel),
})
},
{
ScrollViewItemTypeEnum.SVI_TowColText,
new ItemInfo(ScrollViewItemTypeEnum.SVI_TowColText,new List<object>()
{
new BgObj("All/ItemBG"),
new SplitSpanObj(30, PixOrScaEnum.Pixel),
new TextObj("Tip1","Tip1:",new Vector3(0.5f,2f,7.5f),new Vector3(1.0f,8.0f,1.0f),1.5f*1.5f,"Arial",45,new Color(0.4f,0.0f,0.5f), TextAnchor.MiddleLeft),
new TextObj("Info1","",new Vector3(2f,2.5f,5.5f),new Vector3(1.0f,8.0f,1.0f),2.5f*1.6f,"Arial",45,new Color(0.4f,0.0f,0.5f), TextAnchor.MiddleCenter),
new TextObj("Tip2","Tip2:",new Vector3(5.5f,1.5f,3f),new Vector3(1.0f,8.0f,1.0f),1.5f*1.5f,"Arial",45,new Color(0.4f,0.0f,0.5f), TextAnchor.MiddleLeft),
new TextObj("Info2","",new Vector3(7f,2.5f,0.5f),new Vector3(1.0f,8.0f,1.0f),2.5f*1.6f,"Arial",45,new Color(0.4f,0.0f,0.5f), TextAnchor.MiddleCenter),
new SplitSpanObj(30, PixOrScaEnum.Pixel),
})
},
{
ScrollViewItemTypeEnum.SVI_SingleColInput,
new ItemInfo(ScrollViewItemTypeEnum.SVI_SingleColInput,new List<object>()
{
new BgObj("All/ItemBG"),
new SplitSpanObj(30, PixOrScaEnum.Pixel),
new TextObj("Tip","Tip:",new Vector3(0.5f,2f,7.5f),new Vector3(1.0f,8.0f,1.0f),1.5f*1.5f,"Arial",45,new Color(0.4f,0.0f,0.5f), TextAnchor.MiddleLeft),
new TMPInputFieldObj("Input","",new Vector3(3f,6.5f,0.5f),new Vector3(1.0f,8.0f,1.0f),6.5f*1.6f,"Arial",45,new Color(0.4f,0.0f,0.5f), TextAnchor.MiddleCenter,"SearchInputField/InputField",new Color(1,0.9f,1),"BtnClickPro:InputValueChange","",TMP_InputField.ContentType.Standard),
new SplitSpanObj(30, PixOrScaEnum.Pixel),
})
},
{
ScrollViewItemTypeEnum.SVI_SingleColDropDown,
new ItemInfo(ScrollViewItemTypeEnum.SVI_SingleColDropDown,new List<object>()
{
new BgObj("All/ItemBG"),
new SplitSpanObj(30, PixOrScaEnum.Pixel),
new TextObj("Tip","Tip:",new Vector3(0.5f,1.5f,8.0f),new Vector3(1.0f,8.0f,1.0f),1.5f*1.5f,"Arial",45,new Color(0.4f,0.0f,0.5f), TextAnchor.MiddleLeft),
new DropDownObj("DropDown",new Vector3(2f,7.5f,0.5f),new Vector3(1.0f,8.0f,1.0f),6.5f*1.6f,40, new List<string>() { },new Color(1,0.9f,1)),
new SplitSpanObj(30, PixOrScaEnum.Pixel),
})
},
{
ScrollViewItemTypeEnum.SVI_TowColInput,
new ItemInfo(ScrollViewItemTypeEnum.SVI_TowColInput,new List<object>()
{
new BgObj("All/ItemBG"),
new SplitSpanObj(30, PixOrScaEnum.Pixel),
new TextObj("Tip1","Tip1:",new Vector3(0.5f,2f,7.5f),new Vector3(1.0f,8.0f,1.0f),1.5f*1.5f,"Arial",45,new Color(0.4f,0.0f,0.5f), TextAnchor.MiddleLeft),
new TMPInputFieldObj("Input1","",new Vector3(2f,2.5f,5.5f),new Vector3(1.0f,8.0f,1.0f),2.5f*1.6f,"Arial",40,Color.blue, TextAnchor.MiddleCenter,"SearchInputField/InputField",new Color(1, 0.9f, 1), "BtnClickPro:InputValueChange","",TMP_InputField.ContentType.Standard),
new TextObj("Tip2","Tip2:",new Vector3(5.5f,1.5f,3f),new Vector3(1.0f,8.0f,1.0f),1.5f*1.5f,"Arial",45,new Color(0.4f,0.0f,0.5f), TextAnchor.MiddleLeft),
new TMPInputFieldObj("Input2","",new Vector3(7f,2.5f,0.5f),new Vector3(1.0f,8.0f,1.0f),2.5f*1.6f,"Arial",40,Color.blue, TextAnchor.MiddleCenter,"SearchInputField/InputField",new Color(1,0.9f,1),"BtnClickPro:InputValueChange","",TMP_InputField.ContentType.Standard),
new SplitSpanObj(30, PixOrScaEnum.Pixel),
})
},
{
ScrollViewItemTypeEnum.SVI_TowColSearchInput,
new ItemInfo(ScrollViewItemTypeEnum.SVI_TowColSearchInput,new List<object>()
{
new BgObj("All/ItemBG"),
new SplitSpanObj(30, PixOrScaEnum.Pixel),
new TextObj("Tip1","Tip1:",new Vector3(0.5f,2f,7.5f),new Vector3(1.0f,8.0f,1.0f),1.5f*1.5f,"Arial",45,new Color(0.4f,0.0f,0.5f), TextAnchor.MiddleLeft),
new SearchInputFieldObj("Input1","",new Vector3(2f,2.5f,5.5f),new Vector3(1.0f,8.0f,1.0f),2.5f*1.6f,"Arial",40,Color.blue, TextAnchor.MiddleCenter,"SearchInputField/InputField","BtnClickPro:InputValueChange",""),
new TextObj("Tip2","Tip2:",new Vector3(5.5f,1.5f,3f),new Vector3(1.0f,8.0f,1.0f),1.5f*1.5f,"Arial",45,new Color(0.4f,0.0f,0.5f), TextAnchor.MiddleLeft),
new SearchInputFieldObj("Input2","",new Vector3(7f,2.5f,0.5f),new Vector3(1.0f,8.0f,1.0f),2.5f*1.6f,"Arial",40,Color.blue, TextAnchor.MiddleCenter,"SearchInputField/InputField","BtnClickPro:InputValueChange",""),
new SplitSpanObj(30, PixOrScaEnum.Pixel),
})
},
{
ScrollViewItemTypeEnum.SVI_ThreeColInput,
new ItemInfo(ScrollViewItemTypeEnum.SVI_ThreeColInput,new List<object>()
{
new BgObj("All/ItemBG"),
new SplitSpanObj(30, PixOrScaEnum.Pixel),
new TextObj("Tip1","Tip1:",new Vector3(0.5f,2.5f,7f),new Vector3(1.0f,3.5f,5.5f),2.5f*1.5f,"Arial",45,new Color(0.4f,0.0f,0.5f), TextAnchor.MiddleLeft),
new TMPInputFieldObj("Input1","",new Vector3(0.5f,2.5f,7f),new Vector3(5.5f,3.5f,1.0f),2.5f*1.6f,"Arial",40,Color.blue, TextAnchor.MiddleCenter,"SearchInputField/InputField",new Color(1,0.9f,1),"BtnClickPro:InputValueChange","",TMP_InputField.ContentType.Standard),
new TextObj("Tip2","Tip2:",new Vector3(3.75f,2.5f,3.75f),new Vector3(1.0f,3.5f,5.5f),2.5f*1.5f,"Arial",45,new Color(0.4f,0.0f,0.5f), TextAnchor.MiddleLeft),
new TMPInputFieldObj("Input2","",new Vector3(3.75f,2.5f,3.75f),new Vector3(5.5f,3.5f,1.0f),2.5f*1.6f,"Arial",40,Color.blue, TextAnchor.MiddleCenter,"SearchInputField/InputField",new Color(1,0.9f,1),"BtnClickPro:InputValueChange","",TMP_InputField.ContentType.Standard),
new TextObj("Tip3","Tip3:",new Vector3(7f,2.5f,0.5f),new Vector3(1.0f,3.5f,5.5f),2.5f*1.5f,"Arial",45,new Color(0.4f,0.0f,0.5f), TextAnchor.MiddleLeft),
new TMPInputFieldObj("Input3","",new Vector3(7f,2.5f,0.5f),new Vector3(5.5f,3.5f,1.0f),2.5f*1.6f,"Arial",40,Color.blue, TextAnchor.MiddleCenter,"SearchInputField/InputField",new Color(1,0.9f,1),"BtnClickPro:InputValueChange","",TMP_InputField.ContentType.Standard),
new SplitSpanObj(30, PixOrScaEnum.Pixel),
})
},
{
ScrollViewItemTypeEnum.SVI_ThreeColSearchInput,
new ItemInfo(ScrollViewItemTypeEnum.SVI_ThreeColSearchInput,new List<object>()
{
new BgObj("All/ItemBG"),
new SplitSpanObj(30, PixOrScaEnum.Pixel),
new TextObj("Tip1","Tip1:",new Vector3(0.5f,2.5f,7f),new Vector3(1.0f,3.5f,5.5f),2.5f*1.5f,"Arial",45,new Color(0.4f,0.0f,0.5f), TextAnchor.MiddleLeft),
new SearchInputFieldObj("Input1","",new Vector3(0.5f,2.5f,7f),new Vector3(5.5f,3.5f,1.0f),2.5f*1.6f,"Arial",40,Color.blue, TextAnchor.MiddleCenter,"SearchInputField/InputField","BtnClickPro:InputValueChange",""),
new TextObj("Tip2","Tip2:",new Vector3(3.75f,2.5f,3.75f),new Vector3(1.0f,3.5f,5.5f),2.5f*1.5f,"Arial",45,new Color(0.4f,0.0f,0.5f), TextAnchor.MiddleLeft),
new SearchInputFieldObj("Input2","",new Vector3(3.75f,2.5f,3.75f),new Vector3(5.5f,3.5f,1.0f),2.5f*1.6f,"Arial",40,Color.blue, TextAnchor.MiddleCenter,"SearchInputField/InputField","BtnClickPro:InputValueChange",""),
new TextObj("Tip3","Tip3:",new Vector3(7f,2.5f,0.5f),new Vector3(1.0f,3.5f,5.5f),2.5f*1.5f,"Arial",45,new Color(0.4f,0.0f,0.5f), TextAnchor.MiddleLeft),
new SearchInputFieldObj("Input3","",new Vector3(7f,2.5f,0.5f),new Vector3(5.5f,3.5f,1.0f),2.5f*1.6f,"Arial",40,Color.blue, TextAnchor.MiddleCenter,"SearchInputField/InputField","BtnClickPro:InputValueChange",""),
new SplitSpanObj(30, PixOrScaEnum.Pixel),
})
},
{
ScrollViewItemTypeEnum.SVI_ThreeColToggle,
new ItemInfo(ScrollViewItemTypeEnum.SVI_ThreeColToggle,new List<object>()
{
new BgObj("All/ItemBG"),
new SplitSpanObj(30, PixOrScaEnum.Pixel),
new ToggleObj("Tip1","Tip1",new Vector3(0.5f,2.5f,7f),new Vector3(1.0f,8.0f,1.0f),"BtnClickPro:ToggleChange",2.5f*1.6f,"Arial",40,new Color(0.4f,0.0f,0.5f),TextAnchor.MiddleLeft),
new ToggleObj("Tip2","Tip2",new Vector3(3.75f,2.5f,3.75f),new Vector3(1.0f,8.0f,1.0f),"BtnClickPro:ToggleChange",2.5f*1.6f,"Arial",40,new Color(0.4f,0.0f,0.5f),TextAnchor.MiddleLeft),
new ToggleObj("Tip3","Tip3",new Vector3(7f,2.5f,0.5f),new Vector3(1.0f,8.0f,1.0f),"BtnClickPro:ToggleChange",2.5f*1.6f,"Arial",40,new Color(0.4f,0.0f,0.5f),TextAnchor.MiddleLeft),
new SplitSpanObj(30, PixOrScaEnum.Pixel),
})
},
{
ScrollViewItemTypeEnum.SVI_TowColDropDown,
new ItemInfo(ScrollViewItemTypeEnum.SVI_TowColDropDown,new List<object>()
{
new BgObj("All/ItemBG"),
new SplitSpanObj(30, PixOrScaEnum.Pixel),
new TextObj("Tip1","Tip1:",new Vector3(0.5f,1.5f,8f),new Vector3(1.0f,8.0f,1.0f),1.5f*1.5f,"Arial",45,new Color(0.4f,0.0f,0.5f), TextAnchor.MiddleLeft),
new DropDownObj("DropDown1",new Vector3(2f,2.5f,5.5f),new Vector3(1.0f,8.0f,1.0f),2.5f*1.6f,40, new List<string>() { },new Color(1,0.9f,1), "BtnClickPro:DropDownValueChange"),
new TextObj("Tip2","Tip2:",new Vector3(5.5f,1.5f,3f),new Vector3(1.0f,8.0f,1.0f),1.5f*1.5f,"Arial",45,new Color(0.4f,0.0f,0.5f), TextAnchor.MiddleLeft),
new DropDownObj("DropDown2",new Vector3(7f,2.5f,0.5f),new Vector3(1.0f,8.0f,1.0f),2.5f*1.6f,40, new List<string>() { },new Color(1,0.9f,1), "BtnClickPro:DropDownValueChange"),
new SplitSpanObj(30, PixOrScaEnum.Pixel),
})
},
{
ScrollViewItemTypeEnum.SVI_ThreeColDropDown,
new ItemInfo(ScrollViewItemTypeEnum.SVI_ThreeColDropDown,new List<object>()
{
new BgObj("All/ItemBG"),
new SplitSpanObj(30, PixOrScaEnum.Pixel),
new TextObj("Tip1","Tip1:",new Vector3(0.5f,2.5f,7f),new Vector3(1.0f,3.5f,5.5f),2.5f*1.5f,"Arial",45,new Color(0.4f,0.0f,0.5f), TextAnchor.MiddleLeft),
new DropDownObj("DropDown1",new Vector3(0.5f,2.5f,7f),new Vector3(5.5f,3.5f,1.0f),2.5f*1.6f,40, new List<string>() { "西安", "咸阳" },new Color(1,0.9f,1), "BtnClickPro:DropDownValueChange"),
new TextObj("Tip2","Tip2:",new Vector3(3.75f,2.5f,3.75f),new Vector3(1.0f,3.5f,5.5f),2.5f*1.5f,"Arial",45,new Color(0.4f,0.0f,0.5f), TextAnchor.MiddleLeft),
new DropDownObj("DropDown2",new Vector3(3.75f,2.5f,3.75f),new Vector3(5.5f,3.5f,1.0f),2.5f*1.6f, 40, new List<string>() { "西安", "咸阳" },new Color(1,0.9f,1), "BtnClickPro:DropDownValueChange"),
new TextObj("Tip3","Tip3:",new Vector3(7f,2.5f,0.5f),new Vector3(1.0f,3.5f,5.5f),2.5f*1.5f,"Arial",45,new Color(0.4f,0.0f,0.5f), TextAnchor.MiddleLeft),
new DropDownObj("DropDown3",new Vector3(7f,2.5f,0.5f),new Vector3(5.5f,3.5f,1.0f),2.5f*1.6f, 40, new List<string>() { "西安", "咸阳" },new Color(1,0.9f,1), "BtnClickPro:DropDownValueChange"),
new SplitSpanObj(30, PixOrScaEnum.Pixel),
})
},
};
2.初始化ScrollView
示例程序用随机类型出生化1万条数据的ScrollView,其实不管是1万还是1千万条数,ScrollView的Content中的对象都会少于3个窗口大小能显示的数据条数。
参数1:指示ScrollView滑动方向,Horizontal:竖直滑动、Vertical:水平滑动;
参数2:表示Items间的间距(像素)
参数3:各类型item的GameObject对象
参数4:各类型item的的高度对象
参数5:item类型的List
参数6:刷新item的回调函数
参数7:参数信息,paras 要么为null,要么必须跟items 条数一致。
List<ItemInfo> items = new List<ItemInfo>();
//List<object> paras = new List<object>();
for (int k = 0; k < 10000; k++)
{
int rd = Random.Range(0, (int)(ScrollViewItemTypeEnum.SVI_BUTT - ScrollViewItemTypeEnum.SVI_Begin -1));
items.Add(g_ItemInfoDic[ScrollViewItemTypeEnum.SVI_Begin + 1 + rd]);
}
g_ScrollView.Ini(ScrollType.Vertical, 3, g_ScrollViewItemTypeObjs, g_ScrollViewItemHigWids, items, ShowTypeTestItem, null);
3.动态刷新Items
在调用ini初始化ScrollView时,第六个参数ShowTypeTestItem为刷新Item的回调函数,再即将显示某Item时才会被调用,用于更加参数刷新item的内容。
示例中的ShowTypeTestItem刷新了index,代码样例如下:
public void ShowTypeTestItem(RectTransform trans, int index, List<object> paras)
{
ScrollViewItemTypeEnum scrollViewItemType = (ScrollViewItemTypeEnum)Enum.Parse(typeof(ScrollViewItemTypeEnum), trans.name);
switch (scrollViewItemType)
{
case ScrollViewItemTypeEnum.SVI_SingleColTextWithTip:
{
trans.transform.Find("Tip").GetComponent<Text>().text = "index:" + index.ToString();
}
break;
case ScrollViewItemTypeEnum.SVI_TowColText:
{
trans.transform.Find("Tip1").GetComponent<Text>().text = "index:" + index.ToString();
}
break;
case ScrollViewItemTypeEnum.SVI_ThreeColDropDown:
{
trans.transform.Find("Tip1").GetComponent<Text>().text = "index:" + index.ToString();
}
break;
case ScrollViewItemTypeEnum.SVI_ThreeColSearchInput:
{
trans.transform.Find("Tip1").GetComponent<Text>().text = "index:" + index.ToString();
}
break;
case ScrollViewItemTypeEnum.SVI_ThreeColInput:
{
trans.transform.Find("Tip1").GetComponent<Text>().text = "index:" + index.ToString();
}
break;
case ScrollViewItemTypeEnum.SVI_ThreeColToggle:
{
trans.transform.Find("Tip1").transform.Find("Label").GetComponent<Text>().text = "index:" + index.ToString();
}
break;
case ScrollViewItemTypeEnum.SVI_SingleColText:
{
trans.transform.Find("Tip").GetComponent<Text>().text = "index:" + index.ToString();
}
break;
case ScrollViewItemTypeEnum.SVI_SingleColDropDown:
{
trans.transform.Find("Tip").GetComponent<Text>().text = "index:" + index.ToString();
}
break;
case ScrollViewItemTypeEnum.SVI_TowColDropDown:
{
trans.transform.Find("Tip1").GetComponent<Text>().text = "index:" + index.ToString();
}
break;
case ScrollViewItemTypeEnum.SVI_SingleColInput:
{
trans.transform.Find("Tip").GetComponent<Text>().text = "index:" + index.ToString();
}
break;
case ScrollViewItemTypeEnum.SVI_TowColSearchInput:
{
trans.transform.Find("Tip1").GetComponent<Text>().text = "index:" + index.ToString();
}
break;
case ScrollViewItemTypeEnum.SVI_SingleColTextWithOutTip:
{
trans.transform.Find("TextInfo").GetComponent<Text>().text = "index:" + index.ToString();
}
break;
case ScrollViewItemTypeEnum.SVI_TowColInput:
{
trans.transform.Find("Tip1").GetComponent<Text>().text = "index:" + index.ToString();
}
break;
}
}
4.附加说明
- 示例程序中附带了一个非常好用的二维码封装包,可生产、扫描二维码和条形码。
5.程序运行截图
- 初始状态:
滚动后可能会少量增加一点items,因为某类型的items可能在某个过程中比较多,之后出现比较少,这样就会空闲一些items,左侧Content中处于隐藏状态的就是这种情况,
二、示例工程编译及运行
- 解压LoopScrollView.zip文件,使用unity
2019.2.2f1版本打开LoopScrollView文件夹,点击“Tool” -> IniScence初始化场景。