feat: add illustration for home timeline empty state

This commit is contained in:
CMK 2021-07-09 13:16:58 +08:00
parent 0e7fcfcc7d
commit d350213f6c
7 changed files with 60 additions and 11 deletions

View File

@ -12,7 +12,7 @@
<key>CoreDataStack.xcscheme_^#shared#^_</key>
<dict>
<key>orderHint</key>
<integer>21</integer>
<integer>20</integer>
</dict>
<key>Mastodon - ASDK.xcscheme_^#shared#^_</key>
<dict>
@ -37,7 +37,7 @@
<key>NotificationService.xcscheme_^#shared#^_</key>
<dict>
<key>orderHint</key>
<integer>20</integer>
<integer>21</integer>
</dict>
</dict>
<key>SuppressBuildableAutocreation</key>

View File

@ -24,6 +24,7 @@ internal enum Asset {
internal static let accentColor = ColorAsset(name: "AccentColor")
internal enum Asset {
internal static let email = ImageAsset(name: "Asset/email")
internal static let friends = ImageAsset(name: "Asset/friends")
internal static let mastodonTextLogo = ImageAsset(name: "Asset/mastodon.text.logo")
}
internal enum Circles {

View File

@ -0,0 +1,23 @@
{
"images" : [
{
"filename" : "friends 3.png",
"idiom" : "universal",
"scale" : "1x"
},
{
"filename" : "friends 2.png",
"idiom" : "universal",
"scale" : "2x"
},
{
"filename" : "friends 1.png",
"idiom" : "universal",
"scale" : "3x"
}
],
"info" : {
"author" : "xcode",
"version" : 1
}
}

Binary file not shown.

After

Width:  |  Height:  |  Size: 585 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 221 KiB

Binary file not shown.

After

Width:  |  Height:  |  Size: 125 KiB

View File

@ -24,12 +24,18 @@ final class HomeTimelineViewController: UIViewController, NeedsDependency, Media
private(set) lazy var viewModel = HomeTimelineViewModel(context: context)
let mediaPreviewTransitionController = MediaPreviewTransitionController()
let friendsAssetImageView: UIImageView = {
let imageView = UIImageView()
imageView.image = Asset.Asset.friends.image
imageView.contentMode = .scaleAspectFill
return imageView
}()
lazy var emptyView: UIStackView = {
let emptyView = UIStackView()
emptyView.axis = .vertical
emptyView.distribution = .fill
emptyView.layoutMargins = UIEdgeInsets(top: 0, left: 20, bottom: 54, right: 20)
emptyView.isLayoutMarginsRelativeArrangement = true
return emptyView
}()
@ -246,9 +252,10 @@ extension HomeTimelineViewController {
view.addSubview(emptyView)
emptyView.translatesAutoresizingMaskIntoConstraints = false
NSLayoutConstraint.activate([
emptyView.leadingAnchor.constraint(equalTo: view.readableContentGuide.leadingAnchor),
emptyView.trailingAnchor.constraint(equalTo: view.readableContentGuide.trailingAnchor),
emptyView.bottomAnchor.constraint(equalTo: view.readableContentGuide.bottomAnchor)
emptyView.topAnchor.constraint(equalTo: view.layoutMarginsGuide.topAnchor),
emptyView.leadingAnchor.constraint(equalTo: view.leadingAnchor),
emptyView.trailingAnchor.constraint(equalTo: view.trailingAnchor),
emptyView.bottomAnchor.constraint(equalTo: view.layoutMarginsGuide.bottomAnchor)
])
if emptyView.arrangedSubviews.count > 0 {
@ -272,11 +279,29 @@ extension HomeTimelineViewController {
button.addTarget(self, action: #selector(HomeTimelineViewController.manuallySearchButtonPressed(_:)), for: .touchUpInside)
return button
}()
emptyView.addArrangedSubview(findPeopleButton)
emptyView.setCustomSpacing(17, after: findPeopleButton)
emptyView.addArrangedSubview(manuallySearchButton)
let topPaddingView = UIView()
let bottomPaddingView = UIView()
emptyView.addArrangedSubview(topPaddingView)
emptyView.addArrangedSubview(friendsAssetImageView)
emptyView.addArrangedSubview(bottomPaddingView)
topPaddingView.translatesAutoresizingMaskIntoConstraints = false
bottomPaddingView.translatesAutoresizingMaskIntoConstraints = false
NSLayoutConstraint.activate([
topPaddingView.heightAnchor.constraint(equalTo: bottomPaddingView.heightAnchor, multiplier: 0.8),
])
let buttonContainerStackView = UIStackView()
emptyView.addArrangedSubview(buttonContainerStackView)
buttonContainerStackView.isLayoutMarginsRelativeArrangement = true
buttonContainerStackView.layoutMargins = UIEdgeInsets(top: 0, left: 32, bottom: 22, right: 32)
buttonContainerStackView.axis = .vertical
buttonContainerStackView.spacing = 17
buttonContainerStackView.addArrangedSubview(findPeopleButton)
buttonContainerStackView.addArrangedSubview(manuallySearchButton)
}
}