前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >Flutter 图片渐变色

Flutter 图片渐变色

作者头像
赵哥窟
发布于 2021-02-02 08:46:50
发布于 2021-02-02 08:46:50
2K00
代码可运行
举报
文章被收录于专栏:日常技术分享日常技术分享
运行总次数:0
代码可运行

原图

Screenshot_1611882540.png

渐变后

Screenshot_1611882430.png

代码

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
@override
  Widget build(BuildContext context) {
    return Stack(
      children: <Widget>[
        Container(
          height: ScreenAdaper.screenHeight(),
          width: ScreenAdaper.screenWidth(),
          child: CachedNetworkImage(
            imageUrl: GetSafeValue.getSafeString(
                'https://gimg2.baidu.com/image_search/src=http%3A%2F%2F5b0988e595225.cdn.sohucs.com%2Fimages%2F20181011%2F97d76bbdd19c4fc9a22e11bb5ce643cc.jpeg&refer=http%3A%2F%2F5b0988e595225.cdn.sohucs.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1614474338&t=14fa75e89ec904eba38aca324bf4535e'),
            fit: BoxFit.cover,
          ),
        ),
        new Container(
          decoration: BoxDecoration(
            gradient: LinearGradient(
              begin: Alignment.topCenter,
              end: Alignment.bottomCenter,
              colors: [
                Colors.transparent,
                Colors.white.withOpacity(0.1),
                Colors.white.withOpacity(0.1),
                Colors.white.withOpacity(0.1),
                Colors.white.withOpacity(0.2),
                Colors.white.withOpacity(0.6),
                Colors.white.withOpacity(0.7),
                Colors.white.withOpacity(0.8),
                Colors.white.withOpacity(0.9),
                Colors.white.withOpacity(1.0),
                Colors.white.withOpacity(1.0),
                Colors.white.withOpacity(1.0),
                Colors.white.withOpacity(1.0),
              ],
            ),
          ),
        ),
      ],
    );
  }
本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
vue2.0 + element-ui 实战项目-导航栏跳转路由(二)
Element UI手册:https://cloud.tencent.com/developer/doc/1270 github地址:https://github.com/ElemeFE/element
王小婷
2020/10/30
3K0
vue2.0 + element-ui 实战项目-导航栏跳转路由(二)
Vue框架Element UI教程-左侧导航栏(四)
Element UI手册:https://cloud.tencent.com/developer/doc/1270 中文文档:http://element-cn.eleme.io/#/zh-CN github地址:https://github.com/ElemeFE/element
王小婷
2025/05/18
2840
Vue框架Element UI教程-左侧导航栏(四)
vue2.0 + element-ui 实战项目- 搭建环境(一)
vue2.0官方网站:http://caibaojian.com/vue/guide/installation.html element-ui官方网站:https://element.eleme.cn/#/zh-CN
王小婷
2020/10/30
6.9K0
vue2.0 + element-ui 实战项目- 搭建环境(一)
vue2.0 + element-ui 多级导航菜单
自从用饿了么框架重构项目以来,遇到 很多问题,我都有一一记录下来,现在特喜欢这个框架,说实话,如果你是用了vue这个技术栈的话,一定要用饿了么的pc端框架哦,遇到问题的时候在网上百度一下,就能找到解决方案,还有很多社区可以讨论,社区文档都比较成熟,很容易上手~~
王小婷
2020/12/08
2.1K0
Vue前端项目-主页布局-左侧导航菜单(静态)[通俗易懂]
https://element.eleme.cn/#/zh-CN/component/menu
全栈程序员站长
2022/09/17
4.2K0
Vue前端项目-主页布局-左侧导航菜单(静态)[通俗易懂]
详解如何在vue项目中引入饿了么elementUI组件
在开发的过程之中,我们也经常会使用到很多组件库;vue 常用ui组件库: https://blog.csdn.net/qq_36538012/article/details/82146649
王小婷
2025/05/18
1830
详解如何在vue项目中引入饿了么elementUI组件
基于Vue+element设计 经典网站后台管理界面
有勇气的牛排
2023/06/25
4090
基于Vue的电商后台管理系统(2)
上期已经实现该系统的登陆界面、路由、登录、退出及导航守卫功能,本期将继续完善该系统的以下功能:从后端获取后台列表数据并渲染到前端页面、用户列表的展示、修改、删除和添加。
全栈程序员站长
2022/06/30
1.2K0
基于Vue的电商后台管理系统(2)
Vue框架Element UI教程-安装环境搭建(一)
Element-Ul是饿了么前端团队推出的一款基于Vue.js 2.0 的桌面端UI框架,一套为开发者、设计师和产品经理准备的基于 Vue 2.0 的桌面端组件库,手机端有对应框架是Mint UI 。
王小婷
2019/05/14
8.2K0
Vue框架Element UI教程-安装环境搭建(一)
【SpringBoot+Vue】005-编写布局和头部、编写侧边栏
訾博ZiBo
2025/01/06
570
【SpringBoot+Vue】005-编写布局和头部、编写侧边栏
详解如何在vue项目中引入饿了么elementUI组件
在开发的过程之中,我们也经常会使用到很多组件库;vue 常用ui组件库: https://blog.csdn.net/qq_36538012/article/details/82146649
王小婷
2018/09/26
6.1K0
详解如何在vue项目中引入饿了么elementUI组件
从0到1开发测试平台(十二)首页面home的编写
后端和前端的基础架构都已经搭建完成,为了相对容易理解,上手快,小白也能上手,而且本身就是公司内部系统,也没太大必要做的很完美,所以在我们初版系统的架构里很多东西都简化了,比如注册中心,网关代理,配置中心,负载均衡,授权认证,用户权限控制到页面按钮,消息队列,缓存,elk等都未引入我们初版系统的架构里。如果有时间后面会讲下JmeterEngine相关api的使用、android原生应用mvp及mvvc架构搭建及React-native构建android项目。
周辰晨
2020/09/03
9620
动态加载router,用Vue+Element UI搭建后台管理系统界面
今天教大家用 Vue + Element UI 搭建一个后台管理系统界面,首先讲一下需要用到的组件标签,重点是左侧菜单栏的创建,Element UI 左侧菜单的标签有:
南风
2019/10/16
3.3K0
动态加载router,用Vue+Element UI搭建后台管理系统界面
Element NavMenu 无限级菜单
数据结构  menudata.json {"data":[ { "id": 1, "path": "/home", "menuName": "商业数据统计", "component": "Home", "childMenu":[{ "id": 2, "path": "/commercial/dataAccount/Day", "menuName": "日统计1",
tianyawhl
2020/02/17
1.5K0
[javascript] 基于elementui的后台界面开发
elementui是一套vuejs框架的ui库 , 主要逻辑是按照vuejs的组件方式来组合的
唯一Chat
2020/04/30
1.4K0
[javascript] 基于elementui的后台界面开发
Vue框架Element UI教程-导航栏跳转路由(五)
Element UI手册:https://cloud.tencent.com/developer/doc/1270 中文文档:http://element-cn.eleme.io/#/zh-CN github地址:https://github.com/ElemeFE/element
王小婷
2019/05/22
7.3K0
【SpringBoot+Vue】007-获取导航数据、数据匹配、折叠按钮
(前端的东西没啥好些的,没啥太大的逻辑性,写什么样子就是什么样子,笔记也没啥好做的)
訾博ZiBo
2025/01/06
940
【SpringBoot+Vue】007-获取导航数据、数据匹配、折叠按钮
vue2+element基础架子2.0
爱学习的前端歌谣
2024/04/03
1250
vue2+element基础架子2.0
浅学前端:Vue篇(三)
而我们今天学习的这个所谓的路由,就是根据浏览器路径不同,用不同的视图组件替换这个页面内容展示。
传说之下的花儿
2023/11/13
4230
Vue框架Element UI教程-安装环境搭建(一)
Element-Ul是饿了么前端团队推出的一款基于Vue.js 2.0 的桌面端UI框架,一套为开发者、设计师和产品经理准备的基于 Vue 2.0 的桌面端组件库,手机端有对应框架是Mint UI 。
王小婷
2025/05/18
5390
Vue框架Element UI教程-安装环境搭建(一)
推荐阅读
相关推荐
vue2.0 + element-ui 实战项目-导航栏跳转路由(二)
更多 >
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档