scratch3.0二次开发之scratch-gui登陆功能的实现

最新推荐文章于 2021-07-21 22:05:20 发布
置顶 最新推荐文章于 2021-07-21 22:05:20 发布
阅读量6k 收藏 27
点赞数 7
分类专栏： scratch3.0二次开发 文章标签： scratch3.0二次开发 scratch登陆功能
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/jyht1226/article/details/103067152
版权

scratch-gui加载的时候是没有登陆功能的。
在这里插入图片描述
但官网是有的

在这里插入图片描述
官网有，难道下载的scratch-gui里没有带登陆功能吗？不是的。scratch-gui带了这个功能。在src\components\menu-bar.jsx文件中有这段代码。
在这里插入图片描述
这是设置右边的几种状态的。this.props.sessionExists的属性是什么呢？
在这里插入图片描述
state.session是scratch-gui里没有设置的，我们需要设置session。设置好的效果
在这里插入图片描述
每次打开scratch-gui后，session会向服务器发出请求，获取session。
以下是我实现登陆功能的效果：
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述
其他的就不多说了，详细的就点击右下方按钮，获取更多信息
在这里插入图片描述

取个昵称就那么难
关注
  • 7
    点赞
  • 踩
  • 27
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 10
    评论
专栏目录
scratch-gui成品（已编译（2020.3最新版））
10-25
scratch gui 是用js开发的编程软件，这里是npm编译后的成品，打开压缩包中的gui文件夹，点击index.html即可运行
Scratch3.0二次开发：（1）环境搭建 .pdf
最新发布
06-11
Scratch3.0二次开发：（1）环境搭建 .pdfScratch3.0二次开发：（1）环境搭建 .pdfScratch3.0二次开发：（1）环境搭建 .pdfScratch3.0二次开发：（1）环境搭建 .pdfScratch3.0二次开发：（1）环境搭建 .pdfScratch3.0...
Scratch3.0 二次开发（2）改个Logo
学习·工作
05-11 1813
目录Hello World想要的效果先看下源代最最粗爆的方法更和谐的方法 Hello World 简单换个Logo就跟Hello world一样一样的。实现这个就能基本掌握这个代码的来龙去脉。 想要的效果 如下图： 先准备好一张Logo图片（比较推荐透明背景的svg或png），下面这是我的 先看下源代 源码结构如下图： 换Logo这种事，显然就是UI的事了，所以定位到components目录下。 logo位于菜单栏，我们看下menu-bar.jsx文件。大约330行的位置： Logo 源自属性：th
【Scratch二次开发】01-界面修改
代码基地
07-15 1890
界面修改 安装 下载scratch-gui项目，并进入目录，执行下面的命令安装依赖包。 git clone https://github.com/LLK/scratch-gui.git cd scratch-gui npm install 目录结构 ├── build # 编译后的文件夹 │ ├── static # 静态资源 │ ├── chunks # scratch核心加载器 │ ├── ind
Scratch二次开发4：登录功能的实现
bailee的专栏
08-30 4587
开源的GUI版本中，并无登录功能，但留了接口，由于使用的是react框架，初学者可能会被绕晕。 下面就简单说说如何实现这个功能。 1、与此有关的源代码： project-state.js(核心，已存在) session.js(登录状态器，需要新加，内容如下) const SET_SESSION = 'session/SET_SESSION'; //登录状态 const initialState = { userid: 0, username: '', nicknam.
第二章 openblock-gui实现用户登录1(切换登录与未登录状态)
weixin_42644340的博客
07-21 665
第二章 openblock-gui实现用户登录 1前言代码编写 前言 接下来几章将带大家实现实现用户登录。这里要求大家必须掌握redux与react-redux，否则你将看到云里雾里，考虑到部分人可能没有学习过React、redux与react-redux，这里建议这部分人先别往下，前去bilibili学习下React相关知识：尚硅谷2021版React技术全家桶全套完整版（零基础入门到精通/男神天禹老师亲授），学完再继续。 代码编写 创建一个user-state的reducer，在src->redu
scratch 3.0二次开发—插件添加
z937619657的博客
08-22 8705
scratch 3.0——extension添加 介绍了scratch环境配置，开始介绍scratch插件的添加。 插件是scratch完成功能的重要组成部分，而进行二次开发也可以从插件入手。 那么，如何添加插件呢？ 第一步：下载插件 刚开始学，我们可能不具备做插件的能力，但我们可以找相应插件自己添加练练手。 hello world 第二步：添加插件 我们知道scratch本身是具有插件的，但这些插件放在什么位置，应该怎样去添加呢？ 插件其实由两部分构成，功能（函数）部分、图像部分 一、功能（函数）部分
Scratch二次开发2：源代码目录结构解析
bailee的专栏
07-16 5121
对于二次开发来说，最令人头痛的就是去了解原来的源代码。 熟练撑握源代码结构的好处：修改、添加、裁剪功能时，不会出一些莫名其妙的错误，或是改出一些隐藏着的BUG。 建议所有二次开发者都认真对源代码有个整体的了解（不一定要读所有源代码）。 一、scratch3.0的目录结构大体如下：（后续会慢慢完善，也请已经了解了的朋友留言，一起完善） scratch-gui │ ├──build #编译后的文件夹 │├──static...
Scratch3 二次开发实现在线编程
zydcomputers的专栏
02-13 6452
项目最终实现，学员在线创意编程，先上效果图。 购买阿里云服务器部署上就OK了。学员注册登陆后，就可以实现在线编程，保存并发布项目。 第一步： 购买阿里云linux服务器，按照nodejs 1.下载nodejs wget https://nodejs.org/dist/v10.16.3/node-v10.16.3-linux-x64.tar.xz 2.解压 tar -xvf...
scratch-gui：用于创建和运行Scratch 3.0项目的图形用户界面
02-07
从头开始Scratch GUI是一组React组件，包括用于创建和运行Scratch 3.0项目的界面安装这需要您安装Git和Node.js。 在您自己的节点环境/应用程序中： npm install https://github.com/LLK/scratch-gui.git 如果您要...
Scratch2.0非常强大的二开版本.rar
12-12
舞台大小、比例任意可调 增加调试窗口 使用了30FPS运行 增加导出SWF 其它更多功能不一一列举 提示：资源需自己导入，需要flash air环境
Scratch-3.0-指令大全
06-15
Scratch-3.0-指令大全 各个模块 各个指令逐个讲解， 内容全面，详细。
scratch-gui3.0 编译完善离线web版
04-20
本压缩包下载解压后,直接打开build文件夹,双击index.html可直接运行,方便小伙伴进行学习和二次开发;功能100%完整,经测试,添加/更改脚本,运行脚本,保存脚本,加载脚本均功能成功运行.本人目前正在scratch底层架构的...
scratch二次开发资源包
06-18
scratch二次开发资源包，包含各角色背景声音文件
Scratch3.0 二次开发（1）拿代码配环境
学习·工作
11-18 3053
目录Scratch 3.0二次开发的初心和目的技术基础准备工作安装 node.js正式开始吧模块说明：拿代码运行 Scratch 3.0 能来看这篇稿子的应该都了解这个东西，以下几行来自百科，请选择性跳过。 Scratch是麻省理工学院开发的一款简易图形化编程工具。这个软件的开发团队称为“终身幼儿园团队”（Lifelong Kindergarten Group）。几乎所有的孩子都会一眼喜欢上这个软件。建立起做编程的欲望。 官方在线平台在这里：https://scratch.mit.edu 也可以下载离线
scratch3.0 scratch-gui中集成自定义用户系统2(第五章)
tank_ft的博客
02-06 5580
scratch3.0系列章节列表 scratch3.0 二次开发-基本介绍(第一章) scratch3.0二次开发运行scratch-gui项目并了解工程结构(第二章) scratch3.0二次自定义品牌logo(第三章) scratch3.0 scratch-gui中集成自定义用户系统1(第四章) scratch3.0 scratch-gui中集成自定义用户系统2(第五章) scr...
scratch3.0二次开发之scratch-www创建project的流程图
jyht1226的博客
03-05 2726
创建新project 是否点击导航创建菜单项用户是否登陆打开网址 /projects/editor打开网址 /projects/editor?turtor=getStart 进入教程页向project_host发送初始的target数据创建新的project获取project_host返回的project的id ...
Scratch3.0二次开发记录(1)
weixin_42273491的博客
12-07 717
Scratch3.0二次开发 准备工作 我的开发环境是Mac OS 10.15.1，windows和linux类似 在电脑中首先全局安装node.js在此不多做赘述 node -v可以查看当前node版本，建议不要用node13版本，后面使用npm的时候node13给我挖了好多坑！后来用的n来管理node.js将node13降至12。 sudo nom install -g yarn sudo...
【Scratch二次开发】04-构建离线版本
代码基地
07-15 1073
离线版本 即使部署在国内网络，访问量很大的情况下，有些图片加载还是很慢。我们完全可以通过本地加载角色和背景资源。这样我们就完全可以构建一个离线版本的 Scratch 应用啦，即使电脑不连接互联网也能够使用。 Server 服务 首先，我们编写一个 Server 服务，用来做静态资源服务器。 这个文件的名字叫app.js。 const express = require('express'); const path = require('path'); const app = express(); // 静
scratch3.0二次开发
09-14
Scratch 3.0是一次非常重大的升级，对少儿编程来说，是一个里程碑式的，进一步降低了用户的学习门槛，拓展了和现实之间的互动。在Scratch 3.0中，有9大扩展模块，包括文字朗读、Makey Makey、micro:bit、Lego EV3、LEGO WeDo 2.0等，这些扩展模块的核心是增强了与现实硬件的连接，让程序与实体硬件设备连接起来。所以，Scratch 3.0的二次开发主要是围绕这些扩展模块展开的。可以利用这些扩展模块来与现实世界进行交互，创造更加丰富的编程体验。同时，Scratch 3.0也是兼容Scratch 2.0的，所以之前使用2.0制作的作品可以在3.0中打开，但反之不行。因此，从2019年开始，使用Scratch 3.0进行编程会是一个更好的选择。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 10
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

取个昵称就那么难

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值