An app that composes text over an image in SwiftUI

Overview

MemeMaker

MemeMaker is a little app using SwiftUI that shows a few things:

  • Main list uses a generic type constrained to View to pass destination view into row

Now has three examples:

Overlay

  • Uses the overlay modifier to overlay the text on top of the image. Probably the cleanest solution.

ZStacks

  • The original example using nested zstacks to pin text to top and bottom of image

Text Gone Wild

  • What happens when the text is allowed to spread out as far as it can
  • Shadow is added to all text in this example so it can be seen

All Example Memes also show

  • Using a named font instead of one of the semantic font styles
  • Adding a shadow to Text and creating a non-named color

It was also used to create this meme, which I found amusing: https://twitter.com/jamesdempsey/status/1138491138740895744

Notes

This is a not-particularly-functional app created by someone on their first day of using a new technology.

  • You can’t edit the text except by editing the code
  • You can't different image unless add other images to the project.
  • You can’t export or share the meme.

The app composes some text over an image in a few different ways and then you can take a screenshot of the result to share if you want to.

Caveats

The image is too wide for the screen, so the ends are clipped.

There should be a more elegant way to pin text at the top and bottom of the image than using two ZStacks.
UPDATE: There is! Check out the Overlay example in the app.

Clearly, I need to learn more about having views size themselves in SwiftUI.

I also need to brush up on my generics and protocols. I know I need the type-erased AnyView type to keep from hardcoding destination views in the row view, but I couldn't explain to you very clearly why.
UPDATE: In fact, I should really only be using AnyView as a last resort. Based on that feedback from Matt Ricketson (@ricketson_), I've updated to use generics.

So, I'm putting this out there as a starting point if you want to check it out or play with it. Feel free to download or fork it and play with it on your own. If you discover better techniques for any of it, I'd love it if you'd let me know. I'm @jamesdempsey at Micro.blog and Twitter.

You can read more about my initial experiences with SwiftUI at jamesdempsey.net.

You might also like...
Porting the example app from our Advanced iOS App Architecture book from UIKit to SwiftUI.

SwiftUI example app: Koober We're porting the example app from our Advanced iOS App Architecture book from UIKit to SwiftUI and we are sharing the cod

Quotes App is quotes browsing app which is built with Quotable Free API completely in SwiftUI.
Quotes App is quotes browsing app which is built with Quotable Free API completely in SwiftUI.

Quotes App is quotes browsing app which is built with Quotable Free API completely in SwiftUI. You can watch the whole journey of building this

SwiftUI App to view the App Activity Record from iOS 15
SwiftUI App to view the App Activity Record from iOS 15

App Activity Viewer A viewer for the iOS 15 "Record App Activity" export. FAQ How do I create an App Activity Report? Go to the "Settings" app of your

The app demonstrates how to use Firebase in a SwiftUI iOS app

Firebase SwiftUIDemo app This app demonstrates how to use Firebase in a SwiftUI iOS app. Firebase Setup Go to firebase.com Click new project. Copy app

Weather-app - Created a simple weather app on Xcode using SwiftUI, only shows one location

weather-app Created a simple weather app on Xcode using SwiftUI, only shows one

This To-Do app was developed using Swift and SwiftUI and works on iOS, MacOS (Apple Silicon) and WatchOS. The tasks are kept on storage even when the app is restarted.

ToDo-SwiftUI This app has a lot of sentimental value for me, given that it helped me a lot to understand the process of doing an iOS app and became th

🎲 100% SwiftUI 2.0, classic 2048 game [SwiftUI 2.0, iOS 14.0+, iPadOS 14.0+, macOS 11.0+, Swift 5.3].
🎲 100% SwiftUI 2.0, classic 2048 game [SwiftUI 2.0, iOS 14.0+, iPadOS 14.0+, macOS 11.0+, Swift 5.3].

swiftui-2048 If you like the project, please give it a star ⭐ It will show the creator your appreciation and help others to discover the repo. ✍️ Abou

A simple SwiftUI Application to demonstrate creation of UI using SwiftUI.
A simple SwiftUI Application to demonstrate creation of UI using SwiftUI.

WatchShop_UI A simple SwiftUI Application to demonstrate creation of UI using SwiftUI. How to run the project ? Fork the project. Run the project usin

A multiplatform SwiftUI project demonstrating various SwiftUI features.

WikiDemo A multiplatform SwiftUI project demonstrating various SwiftUI features, including creating a master-detail interface. It's a multiplatform ve

Owner
James Dempsey
James Dempsey
Mac OSX app that displays window previews when hovering over app icon on the Dock.

Dock Window Preview Adds window preview functionality on hover for Mac Dock, an open-source alternative. This is very early in development and it will

Paul Sweeney 32 Dec 26, 2022
Completed Project for Cross Platform Image Filter SwiftUI macOS & iOS App

Completed Project for Cross Platform Image Filter SwiftUI macOS & iOS App Follow the tutorial at alfianlosari.com Features Filter image using predefin

Alfian Losari 73 Dec 19, 2022
Stock is a MacOS menu bar app that helps you quickly save a web link, a file link, or a text by using drag and drop

Stock is a MacOS menu bar app that helps you quickly save a web link, a file link, or a text by using drag and drop

シュンジョーァ 19 Dec 4, 2022
Shows a Pokémon list with its image and name with SwiftUI

TelepassDigitalTestIB Description General This project aims to develop an app, for Telepass interview process, that shows a Pokémon list with its imag

null 1 Jul 5, 2022
Random image app

Random image app About the project / О проекте English In that application I desided to make a custom servise which can directly take a random image w

null 0 Dec 6, 2021
CollectionComposer2 - Copy random image files from various sources to destination folder - ready to use

CollectionComposer2 This is a small tool to copy a random number of image files from different source folders to a destination folder. As an additiona

Holger Hinzberg 0 Jan 4, 2022
IOS15-SwiftUI-InAppPurchaseDemo - In-App Purchase Demo app written with SwiftUI

iOS15-SwiftUI-InAppPurchaseDemo In-App Purchase Demo app written with SwiftUI If

null 5 Jul 20, 2022
In this mini app covered the concepts like basics of SwiftUI and Navigations and Animations and List with CRUD functions and MVVM and App Launch and App icons adding and also applied persistence using UserDefaults Concept.

TodoList In this application used the concepts from the beginner level project of SwiftUI_Evolve_1 The following concepts covered in this mini app Swi

Sivaram Yadav 2 Dec 4, 2021
E-commerce app built in SwiftUI. Built in the course SwiftUI Masterclass in Udemy.

Touchdown-SwiftUI E-commerce app built in SwiftUI. Built in the course SwiftUI Masterclass in Udemy. Main components and concepts used: @EnvironmentOb

Jorge Martinez 5 Aug 18, 2022