SwiftUI实战系列
- SwiftUI实战-使用ViewModifier自定义微信TabBar底部导航和NavigationView
- SwiftUI实战-NavigationLink图片和文字显示蓝色或者图片无显示
- SwiftUI实战-去除List分割线
- SwiftUI实战-自定义弹窗
- SwiftUI实战-自定义加载指示器HUD
- SwiftUI实战-广告页、欢迎页
- SwiftUI实战-NavigationView + TabView基本框架搭建
- SwiftUI实战-Pager分页查看器
- SwiftUI实战-隐私政策和用户协议弹窗
- SwiftUI实战-多图、大图图片浏览
- SwiftUI实战-下拉菜单
- SwiftUI实战-系统NavigationView自定义titleView
- SwiftUI实战-WKWebView的使用
- SwiftUI实战-自定义转圈指示器
- SwiftUI实战-自定义TextField搭建登录页面UI
- SwiftUI实战-自定义底部弹窗
- SwiftUI实战-显示星级评分
- SwiftUI实战-类似新闻头条轮播滚动
- SwiftUI实战-仿用户协议确认页面支持点击文字显示协议
- SwiftUI实战-新特性、新版本介绍
- SwiftUI实战-多图选择、图片选择器
- SwiftUI实战-轮播图
- SwiftUI实战-网络请求工具封装
- SwiftUI实战-多级联动地址选择
- SwiftUI实战-使用UIActivityIndicatorView
- SwiftUI实战-Expanded可伸缩的分组列表List
- SwiftUI实战-滚动列表内容返回顶部、底部、指定位置
- SwiftUI实战-List列表内容动态改变更新
- SwiftUI-绘制气泡图
- SwiftUI-仿微信加号Popover气泡弹窗
- SwiftUI实战-单边圆角单个圆角
本章内容
无限轮播图
相关源码:
ContentView.swift
import SwiftUI
struct ContentView: View {
@State var imagesName = ["12345", "67891"]
@State var images = ["12345", "67891"]
@State var currentIndex: Int = 0
var body: some View {
VStack {
ZStack(alignment: .bottom) {
CustomLoopView.init(urls: images, currentIndex: $currentIndex)
HStack(alignment: .center, spacing: 6) {
ForEach(0..<imagesName.count, id:\.self ) { index in
let isCurrentIndex = index == currentIndex
Color(isCurrentIndex ? .systemBlue : .white).cornerRadius(2).frame(width: isCurrentIndex ? 10 : 4, height: 4)
}
}
.frame(height: 20)
}
Spacer()
}.onAppear {
images = [imagesName.last!] + images + [imagesName.first!]
}
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
CustomLoopView.swift