Skip to content

Instantly share code, notes, and snippets.

@fabiogiolito
Last active June 23, 2019 18:18
Show Gist options
  • Star 2 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save fabiogiolito/881d5fcd3c7193a767062caa76e29ae0 to your computer and use it in GitHub Desktop.
Save fabiogiolito/881d5fcd3c7193a767062caa76e29ae0 to your computer and use it in GitHub Desktop.
//
// InstagramFeed.swift
// Landmarks
//
// Created by Fabio Giolito on 04/06/2019.
// Copyright © 2019 Apple. All rights reserved.
//
// ===================================================
// This is just a quick UI test.
// Not passing any data, and using just basic elements as a starting point.
// If you prefer to see different elements separate into components check out this other gist:
// https://gist.github.com/fabiogiolito/e9e68e5149c337f0dc572660cea9b410
import SwiftUI
struct InstagramFeed : View {
var body: some View {
// Hardcode list repetition
List(0 ..< 5) { item in
VStack(alignment: .leading, spacing: 0) {
// User bar
HStack(alignment: .center, spacing: 12) {
Image("turtlerock")
.frame(width: 40, height: 40)
.clipShape(Circle())
VStack(alignment: .leading, spacing: 2) {
Text("Display Name")
.font(.subheadline)
.bold()
Text("Location")
.font(.caption)
}
Spacer()
Image(systemName: "ellipsis")
}
.padding(.horizontal)
.padding(.vertical, 8)
// Post image
Image("turtlerock").resizable().frame(height: 414)
// Action bar
HStack(spacing: 16) {
Image(systemName: "heart").imageScale(.large)
Image(systemName: "bubble.right").imageScale(.large)
Image(systemName: "arrowshape.turn.up.right").imageScale(.large)
Spacer()
Image(systemName: "bookmark").imageScale(.large)
}
.frame(height: 32)
.padding(.horizontal)
.padding(.top, 12)
// Post info
VStack(alignment: .leading, spacing: 8) {
Text("6 172 likes")
.font(.subheadline)
.bold()
HStack {
Text("username")
.font(.subheadline)
.bold()
Text("Post caption")
.font(.subheadline)
}
// Add comment
HStack(alignment: .center, spacing: 8) {
Image(systemName: "circle")
.imageScale(.large)
Text("Add a comment…")
.font(.subheadline)
.color(Color.gray)
Spacer()
}
.padding(.vertical, 8)
Text("2 DAYS AGO")
.font(.caption)
.color(Color.gray)
}
.padding()
}
}.padding(.horizontal, -20)
}
}
#if DEBUG
struct InstagramFeed_Previews : PreviewProvider {
static var previews: some View {
InstagramFeed()
}
}
#endif
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment