Tagged: SwiftUI

There are 140 items tagged #SwiftUI.
And there a lots of other tags to explore.

SwiftUI Dynamic List View

Learn how to create a list from a collection of data.

How to change SwiftUI List section separator color

Learn how to colorize a list section separator.

How to remove List Section separators in SwiftUI

Some list style has section separators. Let's learn how to remove them.

Multiple rows Selection in SwiftUI List

Learn how to allow multiple row selection in SwiftUI List.

SwiftUI Button: Basic usage

SwiftUI made it incredibly easy to create a button compared to how we do it in UIKit. Let's learn how to do it.

How to make equal height subviews in HStack

Learn how to make all subviews in HStack have an equal height.

How to make a Horizontal List in SwiftUI

A list view doesn't support horizontal scrolling, but we can fake it using ScrollView and LazyHStack. Let's learn how to do it.

Supporting SwiftUI List Selection

Learn how to add list row selection in SwiftUI List.

Create SwiftUI List from an Array

It is very common to populate a list view from an array of data. Let's learn how to do it in SwiftUI.

How to dismiss fullScreenCover in SwiftUI

SwiftUI has many ways to dismiss a modal view based on how you structure your view and the minimum iOS version you support.

How to use custom fonts with SwiftUI

Learn how to use a custom font in your SwiftUI app.

What is the difference between List and ForEach in SwiftUI

Even though ForEach and List have similar syntax, they serve different purposes. Let's learn about their differences.

Should we manually call @StateObject initializer

Is it OK to manually initialize @StateObject? Let's find out.

@State variable initialization in SwiftUI

Learn how to initialize a state variable and discuss whether you should do it or not.

How to change List Row separator color in SwiftUI

Learn how to colorize a list row separator.

How to remove the SwiftUI List Row separators

In iOS 15, we can remove a List row separator. Let's learn how to do it.

Using ForEach in SwiftUI List

You can use ForEach inside a List view in SwiftUI, but when should we use it? Let's learn in which cases we should use ForEach.

Disable scrolling in SwiftUI ScrollView and List

In iOS 16, SwiftUI finally got a new modifier to disable scrolling in ScrolView and List.

How to show badge on List Row in SwiftUI

Learn how to add and remove a badge on List rows.

How to change a Tab Bar item color in SwiftUI

By default, the selected tab bar item will use the iOS default blue color. Let's learn how to change this in SwiftUI.

Set SwiftUI app theme with AccentColor

An accent color is a simple and unified way to theming your app. This article will teach you how to set a global accent color for your app.

How to scale margin and padding with @ScaledMetric Property Wrapper

Dynamic Type automatically scales a font size according to Accessibility settings. In iOS 14, we also have a way to scale numeric values like padding and margin.

Building Static List in SwiftUI

Let's learn the easiest way to create a list in SwiftUI.

How to use Non Uppercase in SwiftUI List section header

Most of those styles use uppercase text for the section header. In this article, we will learn how to opt-out of this behavior.

How to adjust List row separator insets in SwiftUI

In iOS 16, we can adjust a List row separator insets with the new alignment, listRowSeparatorLeading.

How to change TabView color in SwiftUI

In iOS 16, SwiftUI got a way to change the bottom tab bar background color with the new modifier, toolbarBackground.

How to show badge on Tab Bar Item in SwiftUI

Learn how to add and remove a badge on Tab Bars.

SwiftUI List Style examples

In this article, I will show you all 6 list styles you can use with SwiftUI List view in iOS.

How to dismiss sheet in SwiftUI

SwiftUI has many ways to dismiss a sheet view based on how you structure your view and the minimum iOS version you support.

How to scale custom fonts with Dynamic Type in SwiftUI

Learn how to make your custom font scale automatically like the system one.

How to add Keyboard Shortcuts in SwiftUI

You can easily add keyboard shortcuts to Mac, iPhone, and iPad with the keyboardShortcut modifier.

How to change SwiftUI Font Width

In Xcode 14.1, SwiftUI finally got new APIs to set the font width.

How to create Rounded Corners View in SwiftUI

There are many ways to create a rounded corners button in SwiftUI. Let's learn how to do it.

How to use UIView in SwiftUI

Learn how to use UIView as a SwiftUI view.

viewDidLoad() in SwiftUI

Learn how to simulate the viewDidLoad() behavior in SwiftUI using the onAppear modifier.

For loop in SwiftUI using ForEach

When creating an app, there is a time when you want to create a repetitive view or a collection of views from an array of data. We can do that in SwiftUI with ForEach.

SwiftUI zIndex: Everything you need to know

zIndex is a modifier that controls the display order of overlapping views in SwiftUI. Let's learn how it works.

SwiftUI List: Basic usage

SwiftUI made it incredibly easy to create a list or table view compared to how we do it in UIKit. Let's learn how to use it.

How to use UIViewController in SwiftUI

Learn how to use UIViewController as a SwiftUI view.

How to add button to navigation bar in SwiftUI

Learn how to add navigation bar buttons in SwiftUI.

SF Font Expanded, Condensed, and Compressed: Three New font width styles in iOS 16

In iOS 16, Apple introduces three new width styles to the SF font family. Let's see what they look like and how to use them.

How to use UIFont in SwiftUI Font

Learn how to convert UIKit UIFont to SwiftUI Font.

How to make SwiftUI button with buttonStyle expand to full width

SwiftUI got many beautiful built-in button styles. One problem you might get is it isn't obvious how to control the size of it. Let's learn how to do it.

SwiftUI AnyLayout - smooth transitions between layout types

In iOS 16, SwiftUI got a new tool, AnyLayout, that makes it possible to transition between layouts while maintaining the identity of the views.

SwiftUI Gauge

iOS 16 brings a new view to SwiftUI, Gauge. Let's see what it is and how to use it.

Custom Layout in SwiftUI

If you have a layout that the built-in layout like VStack and HStack can't serve, you can create a custom one in iOS 16. Let's learn how to do it.

Responsive layout in SwiftUI with ViewThatFit

Making SwiftUI views responsive usually involves a lot of GeometryReaders and if-else. In iOS 16, SwiftUI got a new view that makes it easier. Let's learn how to do it.

What is the fixedSize modifier in SwiftUI

When you read SwiftUI tutorials, you might stumble on the fixedSize() modifier. Let's see what it is and why we need it.

How to change a navigation bar color in SwiftUI on iOS 16

A navigation bar is an essential part of iOS apps. It is a part where we usually apply color to match our branding. In iOS 16, we can customize a navigation bar purely in SwiftUI.

Variable Color in SF Symbols 4

Variable Color is a new feature of SF Symbols that allows you to change the appearance of a symbol based on a percentage value. Let's learn what it is and how to use it.

Hide keyboard when scrolling in SwiftUI with scrollDismissesKeyboard

In iOS, we have dedicated built-in ways to dismiss the keyboard in scrollable content. Let's learn how to set that in SwiftUI.

Bottom Sheet in SwiftUI on iOS 16 with presentationDetents modifier

In iOS 16, we got a native way to present a bottom sheet in SwiftUI. Let's explore its behavior and limitation.

New way to control number of lines of SwiftUI Text in iOS 16

In iOS 16, we got a big improvement over lineLimit modifiers. Let's see what we can do with it.

How to change SwiftUI list background color

In iOS 16, we finally got a native way to change the background color of a list view in SwiftUI.

How to change status bar color in SwiftUI

In SwiftUI, we have no direct way to change a status bar style. But we can indirectly control it through two view modifiers.

Calendar view in SwiftUI with MultiDatePicker

In iOS 16, we have a new view to select multiple dates. Let's explore its capabilities.

How to create multiline TextField in SwiftUI

In iOS 16, we can create a multiple text field with new initializers and a little help from the .lineLimit(_:) modifier.

SwiftUI Grid

iOS 16 add a new Grid view to SwiftUI. A Grid view arranges child views in rows and columns. This table-like structure makes a layout that is hard to do in vertical and horizontal stacks become easier.

How to add a TextField to Alert in SwiftUI

iOS 16 add the ability to integrate a text field in an alert.

First impressions of SwiftUI in WWDC22

An overview of what's new in SwiftUI.

How to change SwiftUI list row background color

Learn a dedicated modifier to change a list row background color in SwiftUI.

CollectionView in SwiftUI with LazyVGrid and LazyHGrid

Learn the difference between a horizontal and vertical grid and everything you need to know to use them.

How to add section header and footer to SwiftUI list

We can group related data in a SwiftUI list using Section view. We can also optionally add a header and footer to describe a particular section. Let's learn how to do that.

Divider in SwiftUI - Everything you need to know

SwiftUI Divider has some limitations, but you can overcome that with modifiers. Let's explore its limitation and capability.

How to style SwiftUI text Font

Learn how to set font size, design, weight, and color in SwiftUI.

How to create SwiftUI circular progress bar

In this tutorial, we will learn how to create a circular progress bar in SwiftUI using just three SwiftUI views.

How to change SwiftUI font size

There are two ways to set a font size for Text view in SwiftUI. Let's see what they are and how to set them.

How to force two lines of Text in SwiftUI

We have no way to set the minimum lines of Text in SwiftUI, but you can have that with this bit of hack.

How to render text with a color gradient in SwiftUI

Learn how to apply gradient colors to a SwiftUI text view.

How to use Label in SwiftUI custom view

A guideline on how to embrace a label in your custom view.

How to draw custom paths and shapes in SwiftUI

Learn how to make hexagon-shaped profile pictures in SwiftUI.

How to align text center/leading/trailing in SwiftUI

Align text within a container view in SwiftUI isn't a straightforward operation as you might think. Let's learn how to do it.

SwiftUI Label: A standard way to label user interface items

A label might seem trivial, but it plays an important role in SwiftUI. Let's learn about this simple view.

What is a variant in SF Symbols

iOS introduces a new concept to SF Symbols, SymbolVariants. Let's see how this improves the way we interact with symbols.

How to initialize NSViewController programmatically without nib

Initializing an NSViewController without nib isn't straightforward as UIViewController. Trying to do so would result in a runtime error. Let's learn how to do that.

How to make a SwiftUI view to fill its container width and height

We can use a frame modifier to make a view appear to be full width and height, but the result might not be what you expected.

How to make a custom button style supports leading dot syntax in SwiftUI

In Swift 5.5, we can apply button style using leading dot syntax, .buttonStyle(.plain), instead of a full name of a concreate type, .buttonStyle(PlainButtonStyle()). Let's see how we can make our custom button style support this.

How to present an alert in SwiftUI in iOS 15

Learn the difference between all-new alert APIs in iOS 15.

How to define custom environment values in SwiftUI

It might not be obvious that we can create a custom environment value, but we can do that. The steps to create one are not as straightforward as we usually do, but it isn't hard if you know how to do it.

How to show multiple alerts on the same view in SwiftUI

If you have ever worked with an app with multiple alerts, please beware that the system can present only the latest or outermost one. Let's see how we can mitigate this.

How to present an alert in SwiftUI in iOS 13/14

Learn how to show an alert (UIAlertController) in SwiftUI.

How to do print debugging in SwiftUI

Learn how to add a print() in a SwiftUI view.

Pop-Up Buttons in SwiftUI

Learn how to create macOS pop-up buttons in SwiftUI.

How to show and hide a sidebar in a SwiftUI macOS app

Once the sidebar is collapsed, there is no way to get it back. Learn how to mitigate the situation.

Always show search bar in a navigation bar in SwiftUI

In UISearchController, we can set search bar hiding behavior with hidesSearchBarWhenScrolling property. But how to control this behavior isn't obvious in SwiftUI. Learn how to control search bar hiding behavior in SwiftUI.

Searchable modifier in SwiftUI: A UISearchController and UISearchBar equivalent

SwiftUI finally got native search support in iOS 15. We can add search functionality to any navigation view with the new searchable modifier. Let's explore its capability and limitation.

Preview a device in landscape orientation with previewInterfaceOrientation

New in iOS 15, SwiftUI has finally support preview in landscape orientation. Let's find out how to do it.

Pull to refresh in SwiftUI with refreshable

SwiftUI got a native way to add UIRefreshControl in iOS 15. Let's find out how to add it in the list view and even your custom view.

How to make a simple bevel effect using inner shadows in SwiftUI

We can make a simple bevel effect using two inner shadows. SwiftUI has a built-in way to add a drop shadow with the shadow modifier. But if you want to add an inner shadow effect, you need to be a bit creative.

4 Xcode shortcuts to boost your productivity for SwiftUI

Leaning tips and tricks about the tool will help you down the road. Today, I will show you 4 Xcode shortcuts that I find helpful when dealing with SwiftUI.

How to set a screen's background color in SwiftUI

Setting background color in SwiftUI is not as straightforward as UIKit. Let's learn how to do it.

How to resize an image view to fit a container view in SwiftUI

Learn how to fit an image view to any container.

Replicate 12 UIKit's contentMode options in SwiftUI

In UIKit, we have various ways to control an image's position and behavior in UIImageView with a help contentMode property. In SwiftUI, we only have fit and fill content mode. Let's see how we can replicate the rest.

How to add background to your view in SwiftUI

Learn how hard or easy it is to add a background view in SwiftUI.

How to preview a device in landscape orientation with SwiftUI Previews

SwiftUI doesn't have a built-in way to preview for a device in landscape orientation at the moment, but we can simulate that with a few modifiers.

NSAttributedString in SwiftUI

Find out what is the SwiftUI way of styling portions of text.

How to initialize @StateObject with parameters in SwiftUI

@StateObject is an essential property wrapper in SwiftUI, but I found the way to initialize them is not obvious.

How to resize a SwiftUI Image and keep its aspect ratio

Learn how to use aspect fit and aspect fill content mode to fit your image to its bounds.

How to fix ZStack's views disappear transition not animated in SwiftUI

Show and hide transition animation in ZStack can be glitchy. Learn how to fix it with a simple trick.

How to create segmented control in SwiftUI

Learn the way to create the UISegmentedControl equivalent in SwiftUI.

How to use SwiftUI Picker

Learn how to use Picker, a UIPickerView equivalent for SwiftUI.

Navigation in SwiftUI

Part 4 in the series "Building Lists and Navigation in SwiftUI". We will explore a NavigationView, UINavigationController equivalent in SwiftUI.

List view, a UITableView equivalent in SwiftUI

Part 3 in the series "Building Lists and Navigation in SwiftUI". We will explore a List, UITableView equivalent in SwiftUI.

How to use ScrollView in SwiftUI

Part 2 in the series "Building Lists and Navigation in SwiftUI". We will explore a ScrollView, UIScrollView equivalent in SwiftUI.

What is @Environment in SwiftUI

Learn how SwiftUI shares application settings and preference values across the app.

Create a list of views in SwiftUI using ForEach

Part 1 in the series "Building Lists and Navigation in SwiftUI". We visit the first building block of any list view, content, and how to create them.

TextField in SwiftUI

How to create and use TextField in SwiftUI.

Make a placeholder view in SwiftUI with redacted()

SwiftUI provides an easy way to convert to render any view into a placeholder style by redacting its content.

Move your view around with Drag Gesture in SwiftUI

SwiftUI's UIPanGestureRecognizer equivalent.

How to Add inline images with text in SwiftUI

In iOS 14, we have a new way to put images along with texts.

Cross-promote apps with SKOverlay

SKOverlay is a new tool from Apple for doing apps cross-promotion.

UIToolbar in SwiftUI

In iOS 14, we finally have a way to set a toolbar for a view in a navigation view.

Custom navigation bar title view in SwiftUI

Learn how to set a navigation bar title view in SwiftUI.

A first look at matchedGeometryEffect

This modifier can interpolate position and size between two views. This is one of the most exciting features for me. Let's see what is capable of in this beta.

Should I learn UIKit or SwiftUI

The most popular question since the introduction of SwiftUI. Here is my thought after WWDC20.

Add custom SwiftUI view to View Library with LibraryContentProvider

A new way to create a reusable view.

SwiftUI's Toggle Customization

How to create a reusable toggle style in SwiftUI.

Animation delay and repeatForever in SwiftUI

Explore how delay and repeatForever affect an animation.

tintColor in SwiftUI

We will talk about accentColor, a tintColor equivalent in SwiftUI.

SwiftUI ButtonStyle

How to create a reusable button style in SwiftUI.

SF Symbols: What is it, and how to use?

Introduction of SF Symbols, learn the basics, and how to use them.

How to create Neumorphic design in SwiftUI

Neumorphism or Neomorphism is a new design trend of UI recently. We are going to see how to implement this in SwiftUI.

How to create Activity Ring in SwiftUI

A guide to creating an activity-ring-like circular progress bar in SwiftUI. An in-depth tutorial of what I think when making a custom view. At the end of this article, you will be able to create the Activity ring used in the Activity app on Apple Watch.

Gradient in SwiftUI

SwiftUI has built-in ways to apply gradient color to its view. We are going to explore all three types of gradients provided, LinearGradient, RadialGradient, and AngularGradient.

SwiftUI basic Shape operations

Most complex custom views can be made by composing many basic shapes together. Today we will learn basic operations that we can do with them. It may seem trivial, but knowing these basics will benefit you in the future.

Intrinsic content size in SwiftUI

How to define intrinsic content size in SwiftUI

Inset grouped List in SwiftUI

How to make .insetGrouped UITableView style in SwiftUI List

SwiftUI Animation

Explore how to animate changes in SwiftUI.

Data in SwiftUI, Part 3: Tools

The last part in a series on understanding data in SwiftUI. See all tools SwiftUI provided to declare different types of data and dependency. Learn when and how to use @State, @Binding, ObservableObject, @ObservedObject, @EnvironmentObject, and @Environment.

Data in SwiftUI, Part 2: Views as a function of data

Part 2 in a series on understanding data in SwiftUI. We will talk about the key that makes principles in part 1 possible in SwiftUI. And how this resulting in a reduction of the complexity of UI development.

Data in SwiftUI, Part 1: Data

Part 1 in a series on understanding data in SwiftUI. In the first part, we will try to understand the importance of data and how they play an essential role in SwiftUI.

Custom UIHostingController

Learn how to create a custom subclass of UIHostingController and its benefit.

SwiftUI's ViewModifier

Learn a crucial concept in SwiftUI, view modifier, and a guide of how to create your custom modifier.

SwiftUI changes in Xcode 11 Beta 5

Highlight changes for SwiftUI in beta 5

How to use SwiftUI in UIKit

Using SwiftUI as UIView and UIViewController

SwiftUI changes in Xcode 11 Beta 4

Highlight changes for SwiftUI in beta 4

UISplitViewController in SwiftUI

WWDC session shows us a way to create UISplitViewController with NavigationView in SwiftUI. It finally works in Xcode 11 Beta 3.

SwiftUI changes in Xcode 11 Beta 3

Highlight changes for SwiftUI in beta 3

How to use UIKit in SwiftUI

Using UIView and UIViewController in SwiftUI

MVC (Missing View Controller)

Where is UIViewController in SwiftUI?

See all tags.