游戏商店界面:

实际的效果图如下:

要实现这个滑动,首先我们需要,一个内容显示区域,一个内容滚动区域,如下图:

其中ItemContent挂载的组件如下:

红框标注的地方是右方的滑动块。

然后ItemScrollRect挂载的组件有:

核心是网格布局组,其孩子结点都会自动根据大小进行排列位置。

当能够实现滚动之后,我们还需要对皮肤选择进行代码编写控制:

using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.UI; public class SelectSkin : MonoBehaviour { public Texture selectedTexture;
/// <summary>
/// 点击选择了一个皮肤
/// </summary>
/// <param name="obj"></param>
public void clickSkin(GameObject obj)
{
GameObject g = GameObject.Find("selected");
Destroy(g);
GameObject child = new GameObject("selected");
child.AddComponent<RawImage>().texture = selectedTexture;
child.transform.SetParent(obj.transform);
RectTransform rect=child.GetComponent<RectTransform>();
rect.localPosition = new Vector2(-50, -45);
rect.anchorMin = new Vector2(1, 1);
rect.anchorMax = new Vector2(1, 1); rect.localScale = new Vector3(1, 1, 1);
rect.localRotation = new Quaternion(0, 0, 0, 0); StaticData.Instance.usingSkinName = obj.name;
Debug.Log("当前选择的皮肤名字" + obj.name); }
}

将该脚本挂载在一个SkinController上即可。

之后就可以通过选择出场的皮肤了。


第四章节:https://blog.csdn.net/m0_37316917/article/details/81285930

[Untiy]贪吃蛇大作战(三)——商店界面的更多相关文章

  1. Unity3D游戏贪吃蛇大作战源码休闲益智手机小游戏完整项目

    <贪吃蛇大作战>一款休闲竞技游戏,不仅比拼手速,更考验玩家的策略. 视频演示: http://player.youku.com/player.php/sid/XMzc5ODA2Njg1Ng ...

  2. 贪吃蛇大作战canvas实现(手机触屏操作)--地图逻辑

    //html部分 <!DOCTYPE html><html><head lang="en"> <meta charset="UT ...

  3. Expo大作战(三十九)--expo sdk api之 DocumentPicker,Contacts(获取手机联系人信息),Branch

    简要:本系列文章讲会对expo进行全面的介绍,本人从2017年6月份接触expo以来,对expo的研究断断续续,一路走来将近10个月,废话不多说,接下来你看到内容,讲全部来与官网 我猜去全部机翻+个人 ...

  4. Expo大作战(三十八)--expo sdk api之 FileSystem(文件操作系统)

    简要:本系列文章讲会对expo进行全面的介绍,本人从2017年6月份接触expo以来,对expo的研究断断续续,一路走来将近10个月,废话不多说,接下来你看到内容,讲全部来与官网 我猜去全部机翻+个人 ...

  5. Expo大作战(三十七)--expo sdk api之 GLView,GestureHandler,Font,Fingerprint,DeviceMotion,Brightness

    简要:本系列文章讲会对expo进行全面的介绍,本人从2017年6月份接触expo以来,对expo的研究断断续续,一路走来将近10个月,废话不多说,接下来你看到内容,讲全部来与官网 我猜去全部机翻+个人 ...

  6. Expo大作战(三十六)--expo sdk api之 ImagePicker,ImageManipulator,Camera

    简要:本系列文章讲会对expo进行全面的介绍,本人从2017年6月份接触expo以来,对expo的研究断断续续,一路走来将近10个月,废话不多说,接下来你看到内容,讲全部来与官网 我猜去全部机翻+个人 ...

  7. Expo大作战(三十五)--expo sdk api之Location!

    简要:本系列文章讲会对expo进行全面的介绍,本人从2017年6月份接触expo以来,对expo的研究断断续续,一路走来将近10个月,废话不多说,接下来你看到内容,讲全部来与官网 我猜去全部机翻+个人 ...

  8. Expo大作战(三十四)--expo sdk api之LinearGradient(线性渐变),KeepAwake(保持屏幕不休眠),IntentLauncherAndroid,Gyroscope,

    简要:本系列文章讲会对expo进行全面的介绍,本人从2017年6月份接触expo以来,对expo的研究断断续续,一路走来将近10个月,废话不多说,接下来你看到内容,讲全部来与官网 我猜去全部机翻+个人 ...

  9. Expo大作战(三十三)--expo sdk api之MapView(地图),MailComposer(磁力传感计),Lottie(动画)

    简要:本系列文章讲会对expo进行全面的介绍,本人从2017年6月份接触expo以来,对expo的研究断断续续,一路走来将近10个月,废话不多说,接下来你看到内容,讲全部来与官网 我猜去全部机翻+个人 ...

  10. Expo大作战(三十二)--expo sdk api之Noifications

    简要:本系列文章讲会对expo进行全面的介绍,本人从2017年6月份接触expo以来,对expo的研究断断续续,一路走来将近10个月,废话不多说,接下来你看到内容,讲全部来与官网 我猜去全部机翻+个人 ...

随机推荐

  1. PHP redis有序集合实现分页

    <?php //连接本地的 Redis 服务 $redis = new Redis(); $redis->connect('127.0.0.1', 6379); //设置 redis 字符 ...

  2. golang开发一个简单的grpc

    0.1.索引 https://waterflow.link/articles/1665674508275 1.什么是grpc 在 gRPC 中,客户端应用程序可以直接调用不同机器上的服务器应用程序上的 ...

  3. .NET 6学习笔记(4)——如何在.NET 6的Desktop App中使用Windows Runtime API

    Windows Runtime API是当初某软为了区别Win32 API,力挺UWP而创建的另一套Windows 10专用的API集合.后来因为一些原因,UWP没火.为了不埋没很有价值的Window ...

  4. 9.异步redis

    在使用Python代码操作redis时候,连接.操作.断开都是网络IO #安装支持异步redis的模块 pip3 install aioredis async def execute(address, ...

  5. 六、Kubernetes节点与 Pod 亲和性

    Kubernetes节点与 Pod 亲和性 一.节点亲和性策略介绍 ​pod.spec.nodeAffinity preferredDuringSchedulingIgnoredDuringExecu ...

  6. centos 7.6镜像_Centos7 配置本地yum源为iso镜像

    创建挂载路径 sudo mkdir /media/iso 挂载ISO镜像到目录 sudo mount -o loop CentOS-7-x86_64-Minimal-1810.iso /media/i ...

  7. day12-Servlet02

    Servlet02 6.GET和POST请求的分发处理 开发Servlet,通常编写doGet,doPost方法.来对表单的get和post请求进行分发处理 例子 在web文件夹下面创建一个html页 ...

  8. java学习之EL和JSTL

    0x00前言 EL和JSTL都是JSP的内容的拓展,都是开发的一些东西,稍微学习记录一下,避免以后忘记 0x01EL 0x1基本用法 概念:Expression language 表达式语言 作用:替 ...

  9. 用 vue3 中的 reduce(累加器) 随机生成100个字母,放入数组中,统计每个字母出现的次数

    一.首先不用 reduce() 来实现  代码如下: <template lang=""> <div> <h1>统计每个字母出现的次数,不使用r ...

  10. 修改egg.js项目的默认favicon图标

    在项目根目录下的config/config.default.js文件中配置 将 .ico的图标放在一个目录中 方法一.读取本地文件 const path = require('path'); cons ...