标签: blend-mode

颤振 - 如何将图像与渐变色混合?

我试图复制我的设计师为应用程序所做的登录屏幕设计.

背景图像使用了softLight的blendMode,其结果是它与之混合的颜色是渐变颜色.其次,实际上有两层不同的渐变(一个紫色渐变,一个蓝色渐变)

原始图片:

原始图像

最终的渐变图像

最终的渐变图像

现在我尝试使用colorBlendMode,例如

Image.asset(
      'assets/pioneer-party.jpg',
      fit: BoxFit.cover,
      color: Color(0xff0d69ff).withOpacity(1.0),
      colorBlendMode: BlendMode.softLight,
    ),
Run Code Online (Sandbox Code Playgroud)

问题是颜色属性只需要一种颜色.

然后我尝试了BoxDecoration,例如

DecoratedBox(
      decoration: new BoxDecoration(
        color: const Color(0xff7c94b6),
        image: new DecorationImage(
          fit: BoxFit.cover,
          colorFilter: new ColorFilter.mode(Colors.purple.withOpacity(1.0), BlendMode.softLight),
          image: new NetworkImage(
            'http://www.allwhitebackground.com/images/2/2582-190x190.jpg',
          ),
        ),
      ),
    ),
Run Code Online (Sandbox Code Playgroud)

这仍然让我遇到同样的问题.然后,我尝试单独堆叠每个图层,然后使用渐变来使其看起来接近设计,例如

Image.asset(
      'assets/pioneer-party.jpg',
      fit: BoxFit.cover,
      color: Color(0xff0d69ff).withOpacity(1.0),
      colorBlendMode: BlendMode.softLight,
    ),
    DecoratedBox(
      decoration: BoxDecoration(
        gradient: LinearGradient(
          begin: FractionalOffset.topCenter,
          end: FractionalOffset.bottomCenter,
          colors: [
            Color(0xff0d69ff).withOpacity(0.0),
            Color(0xff0069ff).withOpacity(0.8),
          ],
        ),
      ),
    ),
    DecoratedBox(
      decoration: BoxDecoration(
        gradient: LinearGradient(
          begin: FractionalOffset.topLeft,
          end: FractionalOffset.bottomRight,
          colors: [
            Color(0xff692eff).withOpacity(0.8),
            Color(0xff642cf4).withOpacity(0.8), …
Run Code Online (Sandbox Code Playgroud)

gradient dart flutter blend-mode

13
推荐指数
3
解决办法
9410
查看次数

无法分配“[UIImage]”类型的值?输入“UIImage”(swif3)

我试图将 2 个 uiimages 保存在一起,然后将组合的图像放入一个名为 finalImage 的图像视图中。但是,我收到错误消息,指出我已为我的问题分配了标题。只是想将组合的 uiimage 放在图像视图中。

  @IBOutlet var finalImage: UIImageView!
override func viewDidLoad() {
    super.viewDidLoad()


    let bottomImage:UIImage = UIImage(named: "pic")!
    let topImage:UIImage = UIImage(named:"wall")!
    // Change here the new image size if you want
    let newSize = CGSize(width: bottomImage.size.width, height: bottomImage.size.height)
    UIGraphicsBeginImageContextWithOptions(newSize, false, bottomImage.scale)
    bottomImage.draw(in: CGRect(x: 0,y: 0,width: newSize.width,height: newSize.height))
    topImage.draw(in: CGRect(x: 0,y: 0,width: newSize.width,height: newSize.height), blendMode:CGBlendMode.normal, alpha:1.0)
    let newImage:UIImage = UIGraphicsGetImageFromCurrentImageContext()!
    UIGraphicsEndImageContext()
 //error line
   finalImage.image = newImage.images

    }
Run Code Online (Sandbox Code Playgroud)

uiimageview uiimage ios swift3 blend-mode

0
推荐指数
1
解决办法
1万
查看次数

标签 统计

blend-mode ×2

dart ×1

flutter ×1

gradient ×1

ios ×1

swift3 ×1

uiimage ×1

uiimageview ×1