Update the readme about the options and context usage, like delayPlaceholder

This commit is contained in:
DreamPiggy 2020-03-29 20:50:21 +08:00
parent 80e3137e3d
commit 59634bfab8
1 changed files with 24 additions and 21 deletions

View File

@ -110,20 +110,21 @@ let package = Package(
```swift ```swift
var body: some View { var body: some View {
WebImage(url: URL(string: "https://nokiatech.github.io/heif/content/images/ski_jump_1440x960.heic")) WebImage(url: URL(string: "https://nokiatech.github.io/heif/content/images/ski_jump_1440x960.heic"))
.onSuccess { image, cacheType in // Supports options and context, like `.delayPlaceholder` to show placeholder only when error
// Success .onSuccess { image, cacheType in
} // Success
.resizable() // Resizable like SwiftUI.Image, you must use this modifier or the view will use the image bitmap size }
.placeholder(Image(systemName: "photo")) // Placeholder Image .resizable() // Resizable like SwiftUI.Image, you must use this modifier or the view will use the image bitmap size
// Supports ViewBuilder as well .placeholder(Image(systemName: "photo")) // Placeholder Image
.placeholder { // Supports ViewBuilder as well
Rectangle().foregroundColor(.gray) .placeholder {
} Rectangle().foregroundColor(.gray)
.indicator(.activity) // Activity Indicator }
.animation(.easeInOut(duration: 0.5)) // Animation Duration .indicator(.activity) // Activity Indicator
.transition(.fade) // Fade Transition .animation(.easeInOut(duration: 0.5)) // Animation Duration
.scaledToFit() .transition(.fade) // Fade Transition
.frame(width: 300, height: 300, alignment: .center) .scaledToFit()
.frame(width: 300, height: 300, alignment: .center)
} }
``` ```
@ -155,8 +156,8 @@ var body: some View {
```swift ```swift
var body: some View { var body: some View {
Group { Group {
// Network AnimatedImage(url: URL(string: "https://raw.githubusercontent.com/liyong03/YLGIFImage/master/YLGIFImageDemo/YLGIFImageDemo/joy.gif"))
AnimatedImage(url: URL(string: "https://raw.githubusercontent.com/liyong03/YLGIFImage/master/YLGIFImageDemo/YLGIFImageDemo/joy.gif"), options: [.progressiveLoad]) // Progressive Load // Supports options and context, like `.progressiveLoad` for progressive animation loading
.onFailure { error in .onFailure { error in
// Error // Error
} }
@ -187,11 +188,13 @@ Note: `AnimatedImage` supports both image url or image data for animated image f
Note: `AnimatedImage` some methods like `.transition`, `.indicator` and `.aspectRatio` have the same naming as `SwiftUI.View` protocol methods. But the args receive the different type. This is because `AnimatedImage` supports to be used with UIKit/AppKit component and animation. If you find ambiguity, use full type declaration instead of the dot expression syntax. Note: `AnimatedImage` some methods like `.transition`, `.indicator` and `.aspectRatio` have the same naming as `SwiftUI.View` protocol methods. But the args receive the different type. This is because `AnimatedImage` supports to be used with UIKit/AppKit component and animation. If you find ambiguity, use full type declaration instead of the dot expression syntax.
```swift ```swift
AnimatedImage(name: "animation2") // Just for showcase, don't mix them at the same time var body: some View {
.indicator(SDWebImageProgressIndicator.default) // UIKit indicator component AnimatedImage(name: "animation2") // Just for showcase, don't mix them at the same time
.indicator(Indicator.progress) // SwiftUI indicator component .indicator(SDWebImageProgressIndicator.default) // UIKit indicator component
.transition(SDWebImageTransition.flipFromLeft) // UIKit animation transition .indicator(Indicator.progress) // SwiftUI indicator component
.transition(AnyTransition.flipFromLeft) // SwiftUI animation transition .transition(SDWebImageTransition.flipFromLeft) // UIKit animation transition
.transition(AnyTransition.flipFromLeft) // SwiftUI animation transition
}
``` ```
### Which View to choose ### Which View to choose