{"id":1015,"date":"2025-09-02T15:41:04","date_gmt":"2025-09-02T13:41:04","guid":{"rendered":"https:\/\/mic.st\/blog\/?p=1015"},"modified":"2025-09-08T09:32:23","modified_gmt":"2025-09-08T07:32:23","slug":"how-to-build-swiftui-toast-messages-or-alerts","status":"publish","type":"post","link":"https:\/\/mic.st\/blog\/how-to-build-swiftui-toast-messages-or-alerts\/","title":{"rendered":"How to build SwiftUI Toast messages or alerts"},"content":{"rendered":"\n<p>When talking about toast messages or alerts I do have an alert message in mind that does show a message and usually dissappears by itself. This means, it is different to a native iOS alert where the user has to perform some action to make it disappear. You can see a lot of examples for toast messages on Dribble (see <a href=\"https:\/\/dribbble.com\/tags\/toast-message\" target=\"_blank\" rel=\"noopener\">https:\/\/dribbble.com\/tags\/toast-message<\/a>). On Android there is a native component for this, on iOS there is not. But often enough a designer wants to have toasts on iOS as well. So, we have to build it ourselves! Let&#8217;s do that and let&#8217;s use SwiftUI for this.<\/p>\n\n\n\n<p><strong>TL;DR: <\/strong><em>You can have a look at all the code in this Github repository I created: <a href=\"https:\/\/github.com\/misteu\/toast-messages\" target=\"_blank\" rel=\"noopener\">https:\/\/github.com\/misteu\/toast-messages<\/a>. It is a Swift Package, so you can also include it in any project you want.<\/em><\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Requirements<\/h2>\n\n\n\n<p>Let&#8217;s keep it really simple for now. For not getting lost in details, here is a list of our rather rough requirements:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>Written in SwiftUI<\/li>\n\n\n\n<li>Our toast should show a title and a subtitle\n<ul class=\"wp-block-list\">\n<li>Some rounded borders to make it look nice<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li>The toast should appear from the bottom in an animated way, should stay there for some time and disappear again<\/li>\n\n\n\n<li>Three different types of alerts\n<ul class=\"wp-block-list\">\n<li>Success: Showing a green checkmark icon<\/li>\n\n\n\n<li>Information: Showing a blue info icon<\/li>\n\n\n\n<li>Error: Showing a red exclamation mark icon<\/li>\n\n\n\n<li>We can use native SFSymbols for the icons (see <a href=\"https:\/\/developer.apple.com\/sf-symbols\/\" target=\"_blank\" rel=\"noopener\">https:\/\/developer.apple.com\/sf-symbols\/<\/a>)<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li>Ideally: Be able to show multiple toast at the same time and animate them in the order they appeared.<\/li>\n<\/ul>\n\n\n\n<h2 class=\"wp-block-heading\">Style the toast<\/h2>\n\n\n\n<p>Let&#8217;s begin with defining our toast&#8217;s message styles. This can be a simple <code>enum<\/code> with some computed properties for the dynamic properties like the icon and its color.<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-1\" data-shcb-language-name=\"Swift\" data-shcb-language-slug=\"swift\"><span><code class=\"hljs language-swift\"><span class=\"hljs-comment\">\/\/\/ All possible types of toast messages.<\/span>\n<span class=\"hljs-class\"><span class=\"hljs-keyword\">enum<\/span> <span class=\"hljs-title\">ToastMessageStyle<\/span> <\/span>{\n\n\t<span class=\"hljs-comment\">\/\/ A success message<\/span>\n\t<span class=\"hljs-keyword\">case<\/span> success\n\t<span class=\"hljs-comment\">\/\/ An info message<\/span>\n\t<span class=\"hljs-keyword\">case<\/span> info\n\t<span class=\"hljs-comment\">\/\/ An error message<\/span>\n\t<span class=\"hljs-keyword\">case<\/span> error\n\n\t<span class=\"hljs-comment\">\/\/\/ The color associated with the type of message.<\/span>\n\t<span class=\"hljs-keyword\">private<\/span> <span class=\"hljs-keyword\">var<\/span> color: <span class=\"hljs-type\">Color<\/span> {\n\t\t<span class=\"hljs-keyword\">switch<\/span> <span class=\"hljs-keyword\">self<\/span> {\n\t\t<span class=\"hljs-keyword\">case<\/span> .success: .green\n\t\t<span class=\"hljs-keyword\">case<\/span> .info: .blue\n\t\t<span class=\"hljs-keyword\">case<\/span> .error: .red\n\t\t}\n\t}\n\n\t<span class=\"hljs-comment\">\/\/\/ The SFSymbol icon name associated with the type of message.<\/span>\n\t<span class=\"hljs-keyword\">private<\/span> <span class=\"hljs-keyword\">var<\/span> iconName: <span class=\"hljs-type\">String<\/span> {\n\t\t<span class=\"hljs-keyword\">switch<\/span> <span class=\"hljs-keyword\">self<\/span> {\n\t\t<span class=\"hljs-keyword\">case<\/span> .success: <span class=\"hljs-string\">\"checkmark.circle\"<\/span>\n\t\t<span class=\"hljs-keyword\">case<\/span> .info: <span class=\"hljs-string\">\"info.circle\"<\/span>\n\t\t<span class=\"hljs-keyword\">case<\/span> .error: <span class=\"hljs-string\">\"exclamationmark.triangle\"<\/span>\n\t\t}\n\t}\n\n\t<span class=\"hljs-comment\">\/\/\/ The icon view to show.<\/span>\n\t<span class=\"hljs-keyword\">var<\/span> icon: some <span class=\"hljs-type\">View<\/span> {\n\t\t<span class=\"hljs-type\">Image<\/span>(systemName: iconName)\n\t\t.foregroundStyle(color)\n\t}\n}<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-1\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">Swift<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">swift<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>As we style the icon already within the <code>ToastMessageStyle<\/code>, we can make everything else <code>private<\/code>. So, the only property we actually need to access from the outside for is <code>icon<\/code>. If you want to do something else with the <code>color<\/code> property, e.g. draw colored borders then feel free of course to make this non-private as well.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Toast Message View Model<\/h2>\n\n\n\n<p>Now, let&#8217;s add the view model for describing a toast message. This should have a title, a message and the icon. The icon can be derived from the message&#8217;s style we just created via its <code>icon<\/code> property. So let&#8217;s add a <code>style<\/code> property as well.<\/p>\n\n\n\n<p>We also make this view model <code>Identifiable<\/code> and also <code>Equatable<\/code> as we need to be able to keep track of the messages somehow.<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-2\" data-shcb-language-name=\"Swift\" data-shcb-language-slug=\"swift\"><span><code class=\"hljs language-swift\"><span class=\"hljs-comment\">\/\/\/ Toast message view model<\/span>\n<span class=\"hljs-class\"><span class=\"hljs-keyword\">struct<\/span> <span class=\"hljs-title\">ToastMessage<\/span>: <span class=\"hljs-title\">Identifiable<\/span>, <span class=\"hljs-title\">Equatable<\/span> <\/span>{\n\n\t<span class=\"hljs-comment\">\/\/\/ The toast message's identifier.<\/span>\n\t<span class=\"hljs-keyword\">let<\/span> id: <span class=\"hljs-type\">String<\/span>\n\n\t<span class=\"hljs-comment\">\/\/\/ The title<\/span>\n\t<span class=\"hljs-keyword\">let<\/span> title: <span class=\"hljs-type\">String<\/span>\n\n\t<span class=\"hljs-comment\">\/\/\/ The message<\/span>\n\t<span class=\"hljs-keyword\">let<\/span> message: <span class=\"hljs-type\">String<\/span>\n\n\t<span class=\"hljs-comment\">\/\/\/ The style of the toast message<\/span>\n\t<span class=\"hljs-keyword\">let<\/span> style: <span class=\"hljs-type\">ToastMessageStyle<\/span>\n}<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-2\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">Swift<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">swift<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<h2 class=\"wp-block-heading\">Toast Message SwiftUI View<\/h2>\n\n\n\n<p>Now we can create a simple view that does use the just created view model (<code>ToastMessage<\/code>). Let&#8217;s use a simple layout:<\/p>\n\n\n\n<ul class=\"wp-block-list\">\n<li>On the leading edge, there should be the icon<\/li>\n\n\n\n<li>On the trailing edge there should be the title and message\n<ul class=\"wp-block-list\">\n<li>Title is at the top with some more prominent fontstyle<\/li>\n\n\n\n<li>Message is at the bottom with some more subtle fontstyle<\/li>\n<\/ul>\n<\/li>\n\n\n\n<li>There should be some background so we can have a nice box with rounded corners<\/li>\n<\/ul>\n\n\n\n<p>Here is what I came up with then given these simple design requirements above:<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-3\" data-shcb-language-name=\"Swift\" data-shcb-language-slug=\"swift\"><span><code class=\"hljs language-swift\"><span class=\"hljs-comment\">\/\/\/ A view showing a toast message.<\/span>\n<span class=\"hljs-class\"><span class=\"hljs-keyword\">struct<\/span> <span class=\"hljs-title\">ToastMessageView<\/span>: <span class=\"hljs-title\">View<\/span> <\/span>{\n\n\t<span class=\"hljs-keyword\">let<\/span> viewModel: <span class=\"hljs-type\">ToastMessage<\/span>\n\n\t<span class=\"hljs-keyword\">var<\/span> body: some <span class=\"hljs-type\">View<\/span> {\n\t\t<span class=\"hljs-type\">HStack<\/span>(alignment: .top) {\n\t\t\tviewModel.style.icon\n\t\t\t<span class=\"hljs-type\">VStack<\/span>(alignment: .leading) {\n\t\t\t\t<span class=\"hljs-type\">Text<\/span>(viewModel.title)\n\t\t\t\t\t.font(.callout)\n\t\t\t\t<span class=\"hljs-type\">Text<\/span>(viewModel.message)\n\t\t\t\t\t.font(.caption)\n\t\t\t\t\t.foregroundStyle(.secondary)\n\t\t\t}\n\t\t}\n\t\t.padding(<span class=\"hljs-number\">8<\/span>)\n\t\t.background {\n\t\t\t<span class=\"hljs-type\">Color<\/span>.gray.opacity(<span class=\"hljs-number\">0.1<\/span>)\n\t\t}\n\t\t.clipShape(.rect(cornerRadius: <span class=\"hljs-number\">4<\/span>))\n    }\n}<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-3\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">Swift<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">swift<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>I added some padding so that the box has a little more breathing space, also some very subtle background color and also rounded borders as promised. This is how the toast messages do look now when rendering in a <code>#Preview<\/code> block with each of the styles:<\/p>\n\n\n<div class=\"wp-block-image\">\n<figure class=\"aligncenter size-full\"><img loading=\"lazy\" decoding=\"async\" width=\"222\" height=\"302\" src=\"https:\/\/mic.st\/blog\/wp-content\/uploads\/2025\/09\/image.png\" alt=\"Toast views created with SwiftUI\" class=\"wp-image-1017\" srcset=\"https:\/\/mic.st\/blog\/wp-content\/uploads\/2025\/09\/image.png 222w, https:\/\/mic.st\/blog\/wp-content\/uploads\/2025\/09\/image-221x300.png 221w\" sizes=\"auto, (max-width: 222px) 100vw, 222px\" \/><figcaption class=\"wp-element-caption\">All of the toast message styles created with SwiftUI<\/figcaption><\/figure>\n<\/div>\n\n\n<p>Nice, I think it&#8217;s looking good enough for now. We can make it nicer later if we want to but let&#8217;s keep it like that for now. If we want to add buttons or something like that we can do that as well later.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Make the toast pop!<\/h2>\n\n\n\n<p>Alright, now we have the toast message view and some models for it. We can already show it on screen but of course what makes a toast a toast message is its animation. Toast messages come from the bottom and also disappear towards the bottom. Similar to what a bread does in your toaster.<\/p>\n\n\n\n<p>In SwiftUI we can just chain a couple of animation modifiers together to achieve this. There are probably also other ways to do this but for me it worked quite nicely by just chaining them like this (add this after the <code>clipShape<\/code> modifier of the view):<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-4\" data-shcb-language-name=\"Swift\" data-shcb-language-slug=\"swift\"><span><code class=\"hljs language-swift\">\t\t.transition(\n\t\t\t.asymmetric(\n\t\t\t\tinsertion: .push(from: .bottom),\n\t\t\t\tremoval: .push(from: .top)\n\t\t\t)\n\t\t\t.combined(with: .opacity)\n\t\t)<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-4\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">Swift<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">swift<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>What we will quickly see when playing around with the animations is that we need an &#8220;asymmetric&#8221; animation. As we want to move in <em>from<\/em> the bottom and move out <em>to<\/em> the bottom. You can use SwiftUI&#8217;s <code>.asymmetric<\/code> modifier for setting two different animations for insertion and removal of the view. Finally, as we do not want to see the view suddenly disappearing we combine it with an <code>.opacity<\/code> animation.<\/p>\n\n\n\n<p>If you wrap your view now inside of an <code>if<\/code> block and toggling it via a <code>Button<\/code> you can already see the toast animation:<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-5\" data-shcb-language-name=\"Swift\" data-shcb-language-slug=\"swift\"><span><code class=\"hljs language-swift\"><span class=\"hljs-type\">Button<\/span>(<span class=\"hljs-string\">\"Show Toast\"<\/span>) {\n\twithAnimation {\n\t\tisShowingToast.toggle()\n\t}\n}<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-5\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">Swift<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">swift<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<figure class=\"wp-block-video aligncenter\"><video height=\"230\" style=\"aspect-ratio: 490 \/ 230;\" width=\"490\" controls poster=\"https:\/\/mic.st\/blog\/wp-content\/uploads\/2025\/09\/Screenshot-2025-09-08-at-09.28.34.png\" src=\"https:\/\/mic.st\/blog\/wp-content\/uploads\/2025\/09\/Screen-Recording-2025-09-02-at-15.12.31.mov\"><\/video><figcaption class=\"wp-element-caption\">Our toast animation so far<\/figcaption><\/figure>\n\n\n\n<p>On simple screens where we only ever want to see a single toast message, this might already be enough. However, if we want to manage multiple toast messages and their appearance we need to add some container for keeping track of all of them.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Introducing Toast Message Container<\/h2>\n\n\n\n<p>The simple idea is to have a view that show toast messages as they &#8220;come in&#8221; and let&#8217;s them disappear in the order they came in. This means we want to create a first in, first out (FIFO) logic. Views should appear and disappear in an animated manner as they are added to an array.<\/p>\n\n\n\n<p>Here is the view just doing that:<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-6\" data-shcb-language-name=\"PHP\" data-shcb-language-slug=\"php\"><span><code class=\"hljs language-php\"><span class=\"hljs-comment\">\/\/\/ Container managing `ToastMessageView`s in a first-in, first-out manner using animations.<\/span>\nstruct ToastMessageContainer: View {\n\n\t<span class=\"hljs-comment\">\/\/\/ All the toast messages to be shown.<\/span>\n\t@Binding <span class=\"hljs-keyword\">var<\/span> toastMessages: &#91;ToastMessage]\n\n\t<span class=\"hljs-comment\">\/\/\/ Currently shown toast messages.<\/span>\n\t@State <span class=\"hljs-keyword\">var<\/span> visibleMessages: &#91;ToastMessage] = &#91;]\n\n    <span class=\"hljs-keyword\">var<\/span> body: some View {\n\t\tVStack {\n\t\t\t<span class=\"hljs-keyword\">ForEach<\/span>(visibleMessages) { model in\n\t\t\t\tToastMessageView(viewModel: model)\n\t\t\t\t\t.onAppear {\n\t\t\t\t\t\tshowNextMessage()\n\t\t\t\t\t\tDispatchQueue.main.asyncAfter(deadline: .now() + <span class=\"hljs-number\">2<\/span>) {\n\t\t\t\t\t\t\twithAnimation {\n\t\t\t\t\t\t\t\tvisibleMessages.removeAll { $<span class=\"hljs-number\">0<\/span> == model }\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t}\n\t\t\t\t\t}\n\t\t\t}\n\t\t}\n\t\t.onChange(of: toastMessages, { oldValue, newValue in\n\t\t\t<span class=\"hljs-keyword\">if<\/span> newValue.count &gt; oldValue.count {\n\t\t\t\tshowNextMessage()\n\t\t\t}\n\t\t})\n    }\n\n\t<span class=\"hljs-comment\">\/\/\/ Shows next message from message stack.<\/span>\n\tfunc showNextMessage() {\n\t\twithAnimation(Animation.bouncy(extraBounce: <span class=\"hljs-number\">0.2<\/span>)) {\n\t\t\t<span class=\"hljs-keyword\">if<\/span> let lastMessage = toastMessages.popLast() {\n\t\t\t\t<span class=\"hljs-keyword\">self<\/span>.visibleMessages.append(lastMessage)\n\t\t\t}\n\t\t}\n\t}\n}<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-6\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">PHP<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">php<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>By having a <code>Binding<\/code> we can manage the toast messages from the outside. Whenever a message is added, this message will be shown and its disappearance managed by the <code>ToastMessageContainer<\/code>.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Wrapping it up<\/h2>\n\n\n\n<p>Now we can add our <code>ToastMessageContainer<\/code> to some view. For testing purposes I just added three buttons for adding toast messages to the array of <code>ToastMessage<\/code>.<\/p>\n\n\n<pre class=\"wp-block-code\" aria-describedby=\"shcb-language-7\" data-shcb-language-name=\"PHP\" data-shcb-language-slug=\"php\"><span><code class=\"hljs language-php\">struct ToastScreen: View {\n\n\t@State <span class=\"hljs-keyword\">var<\/span> messages: &#91;ToastMessage] = &#91;]\n\n\t<span class=\"hljs-keyword\">var<\/span> body: some View {\n\t\tVStack {\n\t\t\tSpacer()\n\t\t\tHStack {\n\t\t\t\tGroup {\n\t\t\t\t\tButton(<span class=\"hljs-string\">\"show success\"<\/span>) {\n\t\t\t\t\t\tmessages.append(\n\t\t\t\t\t\t\tToastMessage(\n\t\t\t\t\t\t\t\tid: UUID().uuidString,\n\t\t\t\t\t\t\t\ttitle: <span class=\"hljs-string\">\"Hello\"<\/span>,\n\t\t\t\t\t\t\t\tmessage: <span class=\"hljs-string\">\"Success Message\"<\/span>,\n\t\t\t\t\t\t\t\tstyle: .success\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t)\n\t\t\t\t\t}\n\t\t\t\t\tButton(<span class=\"hljs-string\">\"show info\"<\/span>) {\n\t\t\t\t\t\tmessages.append(\n\t\t\t\t\t\t\tToastMessage(\n\t\t\t\t\t\t\t\tid: UUID().uuidString,\n\t\t\t\t\t\t\t\ttitle: <span class=\"hljs-string\">\"Hello\"<\/span>,\n\t\t\t\t\t\t\t\tmessage: <span class=\"hljs-string\">\"Info Message\"<\/span>,\n\t\t\t\t\t\t\t\tstyle: .info\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t)\n\t\t\t\t\t}\n\t\t\t\t\tButton(<span class=\"hljs-string\">\"show error\"<\/span>) {\n\t\t\t\t\t\tmessages.append(\n\t\t\t\t\t\t\tToastMessage(\n\t\t\t\t\t\t\t\tid: UUID().uuidString,\n\t\t\t\t\t\t\t\ttitle: <span class=\"hljs-string\">\"Hello\"<\/span>,\n\t\t\t\t\t\t\t\tmessage: <span class=\"hljs-string\">\"Error Message\"<\/span>,\n\t\t\t\t\t\t\t\tstyle: .error\n\t\t\t\t\t\t\t)\n\t\t\t\t\t\t)\n\t\t\t\t\t}\n\t\t\t\t}\n\t\t\t\t.buttonStyle(.bordered)\n\t\t\t}\n\t\t\tSpacer()\n\t\t}\n\t\t.overlay(alignment: .bottom) {\n\t\t\tToastMessageContainer(toastMessages: $messages)\n\t\t}\n\t}\n}<\/code><\/span><small class=\"shcb-language\" id=\"shcb-language-7\"><span class=\"shcb-language__label\">Code language:<\/span> <span class=\"shcb-language__name\">PHP<\/span> <span class=\"shcb-language__paren\">(<\/span><span class=\"shcb-language__slug\">php<\/span><span class=\"shcb-language__paren\">)<\/span><\/small><\/pre>\n\n\n<p>And this is how it looks in action:<\/p>\n\n\n\n<figure class=\"wp-block-video\"><video height=\"1026\" style=\"aspect-ratio: 490 \/ 1026;\" width=\"490\" controls poster=\"https:\/\/mic.st\/blog\/wp-content\/uploads\/2025\/09\/Screenshot-2025-09-08-at-09.30.32.png\" src=\"https:\/\/mic.st\/blog\/wp-content\/uploads\/2025\/09\/Screen-Recording-2025-09-02-at-15.35.16.mov\"><\/video><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Conclusion<\/h2>\n\n\n\n<p>As you saw it is pretty straight forward to add simple toast views to your app using SwiftUI. Of course this solution still has some room for improvement (e.g. customizable timings or interactivity) but it should be a great start to iterate from.<\/p>\n\n\n\n<p>All of the code can be downloaded from this github repository, where I created a Swift package from all of it: <a href=\"https:\/\/github.com\/misteu\/toast-messages\" target=\"_blank\" rel=\"noopener\">https:\/\/github.com\/misteu\/toast-messages<\/a>. Feel free to use or update it however you want. Of course it&#8217;s open for any contributions \ud83d\ude42<\/p>\n\n\n\n<p><\/p>\n","protected":false},"excerpt":{"rendered":"<p>When talking about toast messages or alerts I do have an alert message in mind that does show a message and usually dissappears by itself. This means, it is different to a native iOS alert where the user has to perform some action to make it disappear. You can see a lot of examples for&hellip;<\/p>\n","protected":false},"author":1,"featured_media":1017,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"inline_featured_image":false,"footnotes":""},"categories":[3,82],"tags":[4,35,61],"class_list":["post-1015","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-ios-development","category-swiftui","tag-ios","tag-swift","tag-swiftui"],"_links":{"self":[{"href":"https:\/\/mic.st\/blog\/wp-json\/wp\/v2\/posts\/1015","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/mic.st\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/mic.st\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/mic.st\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/mic.st\/blog\/wp-json\/wp\/v2\/comments?post=1015"}],"version-history":[{"count":7,"href":"https:\/\/mic.st\/blog\/wp-json\/wp\/v2\/posts\/1015\/revisions"}],"predecessor-version":[{"id":1036,"href":"https:\/\/mic.st\/blog\/wp-json\/wp\/v2\/posts\/1015\/revisions\/1036"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/mic.st\/blog\/wp-json\/wp\/v2\/media\/1017"}],"wp:attachment":[{"href":"https:\/\/mic.st\/blog\/wp-json\/wp\/v2\/media?parent=1015"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/mic.st\/blog\/wp-json\/wp\/v2\/categories?post=1015"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/mic.st\/blog\/wp-json\/wp\/v2\/tags?post=1015"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}