00:00
啊,来看一下啊,我们来我们说刚啊刚刚做完复习是吧,那现在我们来讲一个叫job的定制化啊,为什么讲这个东西呢?其实我们不job是不是有自己的一套UI设计的啊,可能这套UI设计不会符合你们公司自己的设计,懂吗?那可能我们会定制化的去写一些不job的一些东西啊,那现在给大家去看一个不知一个项目。啊,它不是一个项目,它是基于不要不去改的一个UI库,大家来看看啊,比如说我登录这块。OK,前面是登录。OK,那这边是不是就登录啊,OK,登录进去啊,大家看这个就是基于去改的一个啊UI库能他就把这些色调啊,这些什么UI风格全部改掉了啊,那所有的东西都在这边啊,怎么去选择文件啊,怎么去啊开关是不是OK,你看这是一个进度条吧,是不是你看什么,比如说I这边啊,这些都是什么。I嘛,自己图标嘛是吧,OK,还有什么登录的登录页是吧,一些表单。
01:04
啊,表单都是有自己的嘛,特点的吗?能不讲,那一般你们如果公司有后台项目啊,就是要写后台界面的,需要你自己一点点去写吧,特别是这种什么类似于表格的,或者这些图的,需要你去写吗?啊,千万不要去写,一定要去找。懂不懂,找一些跟你们就是这个吗,风格类似的UI库拿过来用,能理解吗?因为这些样式实在很无聊,你会写的,而且写的话会发会。花费你大量的时间啊,可是这些功能你们会不会做点击让这个去一个忙。隐藏掉嘛是吧,你看画一些什么表格嘛。懂吗?那这个你看是不是就是什么自己图标嘛,里面干嘛把这个色调换换嘛,搞点阴影嘛。懂吗?所以这些重复性的工作一定要站在UI库上面,懂不懂不要自己去写,千万不要自己去写,你要自己去写一个UI库出来,你看写个UI库出来,那你就要写这么多东西。
02:04
懂吧,那CS文件有这么多啊,都是基于不要去改的。懂吗?啊,所以说这块需要大人码注意一下,以后只要不是画移动端页面。啊,只要是画PC的一些后台的一些站点啊,基本上不要自己去什么手写div啊,自己去撸啊,去撸CS代码啊,不可能的懂不懂啊,如果写的一些什么,就是我们说咱们的项目,大家大家知不道我们的项目的分类啊,啊可能你去公司做TOC的项目。啊,TOC的项目跟To B的项目。To B代表什么意思啊?To a什么鬼啊,没有这个To B代表。对内的啊,就是内网项目是给公司里面的人去用的,懂不懂TOC呢?用户的啊,就是你这个项目干嘛要开发出去给用户去用的,那一般TOC项目的UI的一些一个设计的复杂度,或者说对对这个用户体验,我们是需要去干嘛优化要去考虑的,那To B呢。
03:17
储备项目,不需要考虑用户体验。懂吗?也不需要搞兼容性啊,那出这个项目要考虑用户体验,考虑金容性,To B项目不需要考虑用户体验,不需要考虑兼容性,他说我这个IE上面这个项目跑不起来,直接告诉他给他个U盘让他装C就可以了,那这就是我们做To B项目的一个什么做法,懂不懂?那To B项目比如说比较经典的。OA系统,那就是一个To B项目嘛,是吧,TOC项目比较经典的所有的电商。电商平台肯定都什么。TOC的吗?懂吗?OK,可是一个电商平台里面只有C的部分吗?不可能啊,你想想啊,你们每天看到的货,货品啊,他们价格啊,货物的照片啊,是不是都会干嘛变的,那他肯定是有一个To B的系统在后面干嘛。
04:07
去录数据的懂吗?然后to c twoc那段他们可能是two p TOC的系统用的是同同一套数据库嘛,这样一改的话,是不是我界面上面所所有的什么一些信息是不是都可以干嘛同步掉,懂不懂就要搞清楚To B跟TOC To B是。内网下面啊,可能是对企业的企业级开发,懂懂C是。对客户的啊,啊,客户去开发这个对UI的一个复杂度,对用户的体验是有要求的,他是没有的,可是一般To B项目啊,在数据交付上面更复杂。懂吗?那一个比较大的TOC项目,那又要考虑用户的。体验就是你的UI要复杂,数据的交互量也很大,那这个项目比较难做,懂不懂那所以说一般我们出去开发的话,更多的应该是接触To B的项目。
05:01
懂吗?啊,所以说在UI这一块的话,其实没有太多的要求懂不懂,可是现在有,现在不是大家都知道吗?就是在往在往移动端靠嘛,一般移动端这一块TOC的项目更多,懂吗?啊,所以说以后出去工作的时候,你要知道自己在干嘛。懂吗?OK啊,To B TOC啊,记住那还有一个,大家可能会认为这个To B是面向浏览器的。是不是啊,其实不是这个概念啊,啊,这是面向企业级的,懂吗?就叫企业级开发啊,当然是不是大家大会大家应该听过一个概念,就是一个架构一个。CS架构啊,那这个B,这个B是谁啊,浏览器啊,这个是基于什么浏览器的一个架构方案,这2C呢,客户端的一个方案懂不懂,那像我们现在做的外部前端肯定都是什么。BS的BS架构是要发请求的吧,啊,需要去动态的去服务器上面去拿什么数据的CS架构呢。
06:00
啊,就像安卓跟LLS他们就是一个CS架构,懂不懂这些页面是直接打到本地的。能没理讲OK啊,这个稍微跟他们拉扯一下啊,那这个东西待会可以发给你们啊,我就把这个包发给你们应该就可以了。OK,那这个我就干掉啊,这些UI库有很多啊。啊,不信我们可以看。去哪去哪幺七素材网吗?是不是B走你看到没有啊,博客后台管理系统吗?你看后台管理系统是不是跟我刚刚那个长得差不多是吧,再看。那简直太多了,看到没有?是不是说过了吗?站在巨人的肩膀上,是不是不要自己瞎整?能讲OK。好,那我们这边我们来说一下,简单的说,哎,如果以后里面有一些样式需要你改一改,颜色的风格需要你改一改,那怎么办是吧,对这边我们叫做不需的定制化,来看一下咋整CTRLC,呃,我们看我们把这个源码文件得拿到它。
07:15
OK,月末文件的。是不在这块,那么直接在这个吗?源码里面去改了好了,看一下咋整,比如说现在我这个三格啊,大想想我现在写的这个三格的曹宽是不是30啊OK,然后有天又突然跟你说这个曹款不满足我的需求。是不是我希望这个槽宽达到60,或者说这个炒宽我希望达到100,怎么办?去哪改?改里面什么。是不是改这个变量是吧,比如说长宽是什么。是不他是吧,是找你曹关是干嘛,30P,我想这个曹关改成100是不是改完就行了吗?改完得变译吧,问题是编译哪个文件。
08:02
问题是编译哪个文件,是不是得找到入口啊?入口很简单,就在这。不是不点吗?点开了一看input吗?全部过来了吧,是吧,而且你会发现诶他说老说没有混合,有没有混合,有没有混合,大家看我在印的时候有没有印input。in.less是不是就它in.less嘛,你看它又去把很多全部导进来了吧,等说入口是不是我这个点,那我编译它是不就行了。能不理解那就编一下呗,咋整啊?干嘛,这个给他干嘛干掉吧,是不是是不是把这个干嘛直接。拎进来,哇哇哇哇哇。啊,不管这些错我们不管。啊,我们应该编译谁啊,编辑它吧,执行编译是吧,成功了吧,看上面是不是多了一个CS文件,看这个CS文件里面视频看是不是都在这是吧,那怎么办?我说这个混合我们需要吗?其他全部干掉吧。
09:13
是不是,哎,怎么有有这是我以前放的地方啊,这个这个这两个应该是没有的啊,这个应该是我自己写的,懂吗?啊,这个我先给他干掉。好大看,那我在这边,你看是不是这个这个混合我需要吗?不需要,为什么,记住每次硬input的时候,相当于会把这里面代码进行合并的,你说最终代码都在哪,不算CS里面懂不懂,就所有代码会合,会合并到一块去了,并不像我们CSS里面,你如果去用input的话,他不会帮你代码合并的,他只会帮你去多发请求,就以那个性能太低了,我们不用的,那里面这个硬input的,并不是说去服务,去网络上面把这个东西给你抓过来。而实习帮你合,帮你什么合并到一个文件里面去,懂不懂那这个就可以干嘛干掉删掉不要。
10:07
这边也都不要,是不是这个时候,其实它里面这个槽宽应该是多少。100的是不是不信?我们来看一下,我们之前不是写过代吗?三个L系统的吗?CTRLC直接给吗?贴过来,CTRLV,你好,那这个三个系统里面我们应该改什么,现在这个相当于这个样式,我。定制过了吧,OK,只有你给他干掉。只有你是不是把它加载进来就可以了,来看一下F。看朝宽入道。很明显草宽变大了吧,五十五十一百嘛,财宽是变大了,这是一种方式去改源码吧,是不是啊,可是有时候我们肯定干嘛不想动源码吧。是不是有时候我们说干嘛不想动圆码,为什么?因为动了源码的话,你会把他的结构给破坏掉嘛,没有办法干嘛还原吧,是不是动态性不高。
11:06
是不是这的,比如说你30还是30吗?那怎么办。我不给你源码,我自己在外面去写个文件。OK,我叫什么五点是吧,OK,我写完这个文,这些这些东西我全部改掉。全部干掉啊,我都不要考拉这个文件给他干嘛,删了是吧,怎么办?我说这个文件我。Put input,我去引什么?我去演你这个什么?里面的东西行不行,点点出去less里面的什么?去谁啊,你的入口吗?把你的入口什么拎过来是吧?问你现在我来编译这个达点,是不是相当于就在编译我这个不需要点是不的,可是里面有些东西我要改怎么办?
12:05
怎么办,比如说这个三格的这什么。诶,这个没了。草宽,我是不是要改啊,怎么办?找到我这个什么变量。是不是变量里面CTRLF,是不是它CTRLC。贴过来怎么办?把这个字给你改掉,改成200。问你,我有没有动员吗?没动源码,我只是把源码当成一个混合,干嘛引了进来?是不是这样的,能不能改掉,照样可以。把这个干嘛。拎过来刷新一下是不是就。出来了,我觉得这种方式更好。是不是走你干嘛换成是不是OK,我有没有改啊哥。我是不是这边改,我这边改成了多少。200了吧,好来看你打开了。
13:02
很明显干嘛布局是已经被我破坏掉了,这个咱们不管,你看是不是。一把一把。能理解我的意思吗?OK,那我是不是可以去定制化的去干嘛,去写一些什么样式啊,那这个需要你对这个less的源码是不是搜一个嘛了解一点啊哦,这里面那这个啊,这里面的东西最难的就是什么三格了,你可以看一下其他的,比如说看看表单能不能看到。就是一些最基本的属性,就是些最最最最什么基本的属性懂不懂,一般你需要去改一些自己的一些UI风格的话,你只要搬出什么变量就可以了,就是你要改哪一块你过来找。懂导,你要改文本颜色的,那你把这个字给他改掉啊,可以穿找。在哪定义的,看看是不是在这,你看是一个什么渐变是懂吗?这是也是less里面的一个函数,懂不懂,可是一般我们不会去操作它,如果想知道这个函数什么意思,上官网去看一下就行了,极其简单的,无非是上下去再下下去的,这这种东西懂吗?OK,教你,那这个应该嘛,这应该大家以后的话,如果让你去定制一个的话,应该干嘛?
14:19
有有能力去做,就是工作量的事情啊,根据UI给你的参数,你把里面一些东西给它改掉就行,懂吗?配色方案啊,呃,就是边框的一个什么,就是就是表格的一个展示形式啊,在这个里面都都是可以改的,懂吗?能理解我的意思吗?OK,这里这叫定制化,那定制化我们推荐推荐的方式是叫什么?不是要把less通过混合的形式引入到你自己的那里面去,还有一件事情,也就说你这个变量,我们说干嘛写到上面也是没有,也是没有问题的,它也是可以改掉的,默认在编译的时候的话,他是先读这个音什么,你不是,哪怕你是这种写法,最终最终也是这么去解析的。
15:01
懂吗?所以说你这个变量写上写下没事,只要写在外部就可以了,能理解好,那这个什么叫定制化算法啊,一般。不会有这种需求啊,有这种需求的话,说明你这个公司啊比较大啊,他要需要有一套自己的什么。要需要有有自己的风格,懂吗?有自己风格的时候的话,其实这个事情你只需要去改所有的参数,有产品,有UI,有设计,他们把这个整个界面的什么配色风格啊,边啊边框的展示啊,一些动画的展示,全部把你干嘛当成一个参数写完,然后再给你懂吗?啊你们可以看一下一个比较成熟公司的话,他们的UI应该长什么样,UI图应该长什么样。我也没给你们看过。我记得给你们看过。嗯,应该找标注啊,你看是应该有看过吧,那如果要让你们去改改风格的话,其实要比这个图还要什么还要详细啊,就直接出一个什么文档给你,然后你去改懂不懂,其实你要做的你就知道什么,怎么编译不表就行了,懂吗?OK。
我来说两句