Cosmos,iOS 和 tvOS 的星级评分控件
这是用 Swift 编写的 iOS 和 tvOS 的 UI 控件,用于显示星级评分和从用户那里获取评分。Cosmos 是 UIView 的子类,将允许您的用户发布那些不可避免的 1 星级评论!
- 显示带可选文本标签的星级评分。
- 可以作为评分输入控件使用(仅限 iOS)。
- Cosmos 视图可以在 Storyboard 中进行定制,无需编写代码。
- 包括不同的星星填充模式:全星、半星和精确。
- Cosmos 可访问,并支持语音控制。
- 支持从右到左的语言。
图片由 NASA、ESA 和 G. Bacon (STScI) 提供。来源:spacetelescope.org。
视频教程
感谢 rebeloper.com 的 Alex Nagy 制作了这个精彩的 视频教程,展示了如何从代码中使用和定制 Cosmos。
设置
您有多种方法可以将 Cosmos 添加到您的 Xcode 项目中。
添加资源(iOS 8+)
简单地将 CosmosDistrib.swift 文件添加到您的 Xcode 项目中。
使用 Carthage 配置(iOS 8+)
或者,将 github "evgenyneu/Cosmos" ~> 23.0
添加到您的 Cartfile 中并运行 carthage update
。
使用 CocoaPods 配置(iOS 8+)
如果您使用 CocoaPods,请将此文本添加到您的 Podfile 中并运行 pod install
。
use_frameworks!
target 'Your target name'
pod 'Cosmos', '~> 23.0'
使用 Swift Package Manager 配置
- 在 Xcode 11+ 中选择 文件 > 包 > 添加包依赖...。
- 输入此项目的网址: https://github.com/evgenyneu/Cosmos.git
旧 Swift 版本
如果您使用较旧的 Swift 版本,请设置库的早先版本。
用法
- 将
View
对象从 对象库 拖动到您的 Storyboard 中。
- 在 身份检查器 中将视图的类设置为
CosmosView
。除非您使用了文件设置方法,否则请设置其 模块 属性为Cosmos
。
tvOS 注意:如果您在这个阶段看到构建错误,请阅读以下tvOS 配置说明。
- 在 属性检查器 中自定义 Cosmos 视图的外观。如果故事板中没有显示星星,请从 编辑 菜单中选择 刷新所有视图。
定位 Cosmos 视图
可以使用 Auto Layout 约束来定位 Cosmos 视图。视图的宽度和高度将自动根据其内容的尺寸(星星和文本)确定。因此,不需要在 Cosmos 视图上设置宽/高约束。
在代码中使用 Cosmos
除非您使用了文件设置方法,否则请将 import Cosmos
添加到您的源代码中。
您可以通过在视图控制器中创建一个出口来从您的代码中风格和控制 Cosmos 视图。或者,您可以实例化 CosmosView
类并将其手动添加到视图中,而不是使用 Storyboard。
// Change the cosmos view rating
cosmosView.rating = 4
// Change the text
cosmosView.text = "(123)"
// Called when user finishes changing the rating by lifting the finger from the view.
// This may be a good place to save the rating in the database or send to the server.
cosmosView.didFinishTouchingCosmos = { rating in }
// A closure that is called when user changes the rating by touching the view.
// This can be used to update UI as the rating is being changed by moving a finger.
cosmosView.didTouchCosmos = { rating in }
自定义
可以通过修改其 settings
来从代码中自定义 Cosmos。有关配置选项的完整列表,请参阅Cosmos 配置手册。
// Do not change rating when touched
// Use if you need just to show the stars without getting user's input
cosmosView.settings.updateOnTouch = false
// Show only fully filled stars
cosmosView.settings.fillMode = .full
// Other fill modes: .half, .precise
// Change the size of the stars
cosmosView.settings.starSize = 30
// Set the distance between stars
cosmosView.settings.starMargin = 5
// Set the color of a filled star
cosmosView.settings.filledColor = UIColor.orange
// Set the border color of an empty star
cosmosView.settings.emptyBorderColor = UIColor.orange
// Set the border color of a filled star
cosmosView.settings.filledBorderColor = UIColor.orange
为星星提供图片
默认情况下,Cosmos 从点数组中绘制星星。或者,可以在 Storyboard 和代码中提供自定义的星星图片。
从 Storyboard 中使用星星图片
使用代码中的星形图像
// Set image for the filled star
cosmosView.settings.filledImage = UIImage(named: "GoldStarFilled")
// Set image for the empty star
cosmosView.settings.emptyImage = UIImage(named: "GoldStarEmpty")
注意:为了使此代码正常工作,您需要在项目中包含填充和空星形的图像。
下载星形图像文件
示例应用程序中使用的金色星形图像位于此处。对于其他星形图像的贡献非常受欢迎:将矢量图像添加到/graphics/Stars/
目录并提交拉取请求。
在滚动/表格視图中使用Cosmos
在此介绍了如何在滚动视图或表格视图中使用Cosmos。
使用SwiftUI与Cosmos协同工作
在此介绍了如何使用SwiftUI显示Cosmos视图。
在模态屏幕中使用Cosmos
iOS 13引入了用于关闭模态屏幕的滑动手势,这阻止了Cosmos正常工作。以下设置可解决这个问题
cosmosView.settings.disablePanGestures = true
从 Objective-C 中使用 Cosmos 设置
本手册介绍了如何在 Objective-C 应用中设置/读取 Cosmos 设置。
演示应用
此项目包含一个演示 iOS 应用。
在表格视图中使用 Cosmos
其他解决方案
以下是 iOS 的一些其他星级评分控件
- danwilliams64/DJWStarRatingView
- dlinsin/DLStarRating
- dyang/DYRateView
- erndev/EDStarRating
- hugocampossousa/HCSStarRatingView
- shuhrat10/STRatingControl
- strekfus/FloatRatingView
- yanguango/ASStarRatingView
👍
感谢我们要感谢以下人员的宝贵贡献。
- jsahoo 为添加通过 Carthage 设置方法自定义 Cosmos 视图的功能。
- 0x7fffffff 将
public
访问级别修饰符更改为open
。 - ali-zahedi 将其更新到 Swift 3.0 最新版本。
- augmentedworks 为填充的星星添加了边框。
- craiggrummitt 提供了对 Xcode 8 beta 4 的支持。
- JimiSmith 提供了对 Xcode 8 beta 6 的支持。
- nickhart 为添加与 Xcode 6 的兼容性。
- staticdreams 致力于添加 tvOS 支持。
- wagnersouz4 进行了 Swift 3.1 版本的更新。
- paoloq 报告了当使用 Auto Layout 时,CosmoView 框架大小的问题。
- danshevluk 增加了在多个 Cosmos 视图中复用设置的能力。
- xrayman 报告了一个表格视图重用性问题,并改进了演示应用程序中的表格视图屏幕。
- chlumik 将代码更新到 Swift 4.2。
- rebeloper 制作了一个 视频教程。
- yuravake 添加了
passTouchesToSuperview
设置。 - gcharita 增加了 Swift Package Manager 支持。
- benpackard 修复了在 iOS 13 上使用模态屏幕时 Cosmos 的问题。
- dkk 更新了暗黑模式。
授权
Cosmos 在 MIT 许可下发行。
🌌 ⭐️ 🌕 🚀 🌠
我们是宇宙认识自己的途径。
卡尔·萨根,来自1980年的电视系列《宇宙:个人之旅》。