首页 > 其他分享 >SwiftUI Image 图片处理

SwiftUI Image 图片处理

时间:2024-05-06 21:12:07浏览次数:16  
标签:opacity overlay Image black foregroundStyle SwiftUI font 图片

代码片段

//
//  ContentView.swift
//  SwiftUIImage
//
//  Created by CHEN Hao on 2024/5/6.
//

import SwiftUI

struct ContentView: View {
    var body: some View {
        Image("paris")
            .resizable() // 延伸模式,平铺整个屏幕
        
            // 不保持长宽比
            // .ignoresSafeArea() // 忽略安全区域&排除忽略的安全区域(.container, edges: .bottom)
        
            // 保持长宽比
            // .scaledToFit()
            // 同上
            .aspectRatio(contentMode: .fit)
            // .frame(width: 300)
            // .clipped() // 剪裁图片,基于frame设定的宽度
            // .clipShape(Circle()) // 剪裁成形状
            // .opacity(0.5) // 透明度
        
            // 重叠
//            .overlay(
//                Image(systemName: "heart.fill")
//                    .font(.system(size: 50))
//                    .foregroundStyle(.black)
//                    .opacity(0.5)
//            )
        
//            .overlay(
//                    Text("If you are lucky enough to have lived in Paris as a young man, then wherever you go for the rest of your life it stays with you, for Paris is a moveable feast.\n\n- Ernest Hemingway")
//                        .fontWeight(.heavy)
//                        .font(.system(.headline, design: .rounded))
//                        .foregroundStyle(.white)
//                        .padding()
//                        .background(Color.black) // 背景颜色
//                        .cornerRadius(10) // 圆角
//                        .opacity(0.8)
//                        .padding(),
//                    
//                    alignment: .top // 覆盖位置对齐
//
//            )
        
//            .overlay(
//                Rectangle()
//                    .foregroundStyle(.black)
//                    .opacity(0.4)
//            )
            // 同上
            .overlay(
                Color.black
                    .opacity(0.4)
                    .overlay(
                        Text("Paris")
                            .fontWeight(.black)
                            .font(.largeTitle)
                            .foregroundStyle(.white)
                            .frame(width: 200)
                    )
            )
            
    }
}

#Preview {
    ContentView()
}

效果

标签:opacity,overlay,Image,black,foregroundStyle,SwiftUI,font,图片
From: https://www.cnblogs.com/thankcat/p/18175954

相关文章

  • SwiftUI Text 文字处理
    代码////ContentView.swift//SwiftUIText////CreatedbyCHENHaoon2024/5/6.//importSwiftUIstructContentView:View{varbody:someView{VStack{Text("Yourtimeislimited,sodon’twasteitlivingsomeoneels......
  • vue实现使用JSZip批量下载图片
    1importJSZipfrom"jszip";2import{saveAs}from'file-saver';3import$from'jquery'45//jszip打包下载图片6functionsaveImgZip(imgUrlArrs,typeTxt){7varimgUrlArr=[];//图片列表8imgUrlArr=imgUrlAr......
  • k8s - ERROR: image can't be pulled
       Testedtheimage:zzh@ZZHPC:/zdata/Github/zgrpc-go-professionals$kubectlrunmytest--image=zgrpc-go-professionals:serverpod/mytestcreatedzzh@ZZHPC:/zdata/Github/zgrpc-go-professionals$kubectlgetpodsNAMEREADYSTATUSRESTART......
  • MuMu模拟器12如何将电脑的文件/图片导入到模拟器根目录
    前言全局说明官方说明:https://mumu.163.com/help/20230427/35047_1085406.html一、说明二、部分用户在使用MuMu模拟器12时,可能会需要将电脑的图片或文件一类的,从电脑内导入到模拟器根目录中,但是不知道具体该如何操作,遇到这类情况的用户,可以参考以下步骤操作。第一步......
  • pyqt5设计图片背景和颜色
        tianqi.qrc 根据大小重新 <RCC><qresourceprefix="media"><file>天气.jpg</file><file>音乐.jpg</file><file>map.png</file><file>车.png</file></qresource></RCC>......
  • WPF Image open ZoomIn ZoomOut reset
    //xaml<Windowx:Class="WpfApp94.MainWindow"xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"xmlns:d="http://schemas.mic......
  • 浅谈基于uinapp制作一个搞笑图片生成器
    制作一个搞笑图片生成器可以使用多种技术,其中UniApp是一个不错的选择,因为它允许开发者使用一套代码开发多平台应用。以下是使用UniApp制作搞笑图片生成器的基本步骤:1.项目规划在开始编码之前,你需要规划你的应用。确定你的搞笑图片生成器将包含哪些功能,例如:图片选择:允许用户从......
  • BufferedImage内存泄漏和溢出问题
    java的ImageIO处理图片在使用Thumbnailator时出现了OOM问题,但是其使用方法只有一行代码,无法针对其内部使用的对象进行资源释放,所以使用原生的Java类库中ImageIO来处理图片。关键有三个类:ImageIO、BufferedImage、GraphicsImageIO类包含两个静态方法:read()和write(),通过这两......
  • AWS S3 Lambda Python脚本函数实现图片自动转换为webp并上传至s3
    AmazonS3自动转换图片格式 AmazonS3存储桶新增文件自动触发AWSLambda。Lambda取S3文件做转换并存回去S3同一个目录下,并增加相应的后缀名。并且支持通过APIGateway的方式触发对图片进行修改并输出。本Lab使用PythonPillow做图片转换,读者可以参考Pillow文档......
  • 个人网页-测试程序-网页成功与api交互但未显示好的图片
    python:fromflaskimportFlask,render_template,request,jsonifyimportrequestsimportbase64importosfromPILimportImageimportioimportlogging#ConfigureFlaskapplicationapp=Flask(__name__,template_folder='../templates')app.c......