SwiftUI dev

📅 Календарь бронирования. Возьмем за основу календарь из Avito 👨‍💻

Компонент DatePicker в SwiftUI не позволяет пользователям выбирать диапазон дат. В свою очередь, MultiDatePicker поддерживает эту функцию, но этот контрол доступен только с iOS 16. Создадим свой для iOS 14. Основной дизайн сделаем по образцу календаря в приложении Avito. В нем есть несколько интересных вещей, таких как выбор диапазона дат, недоступные дни или обязательные к бронирования дни.

За кодом сюда

📆Booking calendar. Avito inspired 👨‍💻

SwiftUI’s DatePicker doesn’t allow users to pick a date range. On the other hand, MultiDatePicker allows this, but it is available only from iOS 16. Let’s create our own for iOS 14. The basic design is inspired by the booking calendar from the Avito app. It contains several interesting features, such as date range selection, unavailable days, or mandatory booking days.

Code is here

#tasty #groovy #trytodo

@swiftui_dev

🔥 Весьма удобный и крутой лайфхак, как можно быстро помочь себе в верстке

🧨 Really nice and awesome lifehack how to help yourself with layouts

Думаю, уже все знают про то, как найти размер вьюхи с помощью GeomertyReader, если .frame не задан. Если нет, то я напомню:

Hope everyone already knows how to find the view size using GeomertyReader if .frame is not specified. Don’t worry, I'll remind you:

import SwiftUI 

struct SizePreferenceKey: PreferenceKey {
    static var defaultValue: CGSize = .zero
    static func reduce(value: inout CGSize, nextValue: () -> CGSize) {
        value = nextValue()
    }
}

struct MeasureSizeModifier: ViewModifier {
    func body(content: Content) -> some View {
        content.overlay(GeometryReader { geometry in
            Color.clear.preference(key: SizePreferenceKey.self,
                                   value: geometry.size)
        })
    }
}

extension View {
    func measureSize(perform action: @escaping (CGSize) -> Void) -> some View {
        self.modifier(MeasureSizeModifier.init())
            .onPreferenceChange(SizePreferenceKey.self, perform: action)
    }
}

Теперь создадим структуру и модификатор, которые будем использовать для отображения границ размера элемента:

Next let's create a struct and modifier for displaying the view size:

import SwiftUI 

struct Measurements: View {

    @State private var size: CGSize = .zero

    let showSize: Bool
    let color: Color
    
    var body: some View {
        label.measureSize { size = $0 }
    }

    var label: some View {
        ZStack(alignment: .topTrailing) {
            Rectangle()
                .strokeBorder(
                    color,
                    lineWidth: 1
                )
            
            Text("H:\(size.height.formatted) W:\(size.width.formatted)")
                .foregroundColor(.black)
                .font(.system(size: 8))
                .opacity(showSize ? 1 : 0)
        }
    }
}

extension View {
    func measured(_ showSize: Bool = true, _ color: Color = Color.red) -> some View {
        self
            .overlay(Measurements(showSize: showSize, color: color))
    }
}

extension CGFloat {

    var formatted: String {
        abs(self.remainder(dividingBy: 1)) <= 0.001
            ? .init(format: "%.0f", self)
            : .init(format: "%.2f", self)
    }
}

extension Double {
    var formatted: String {
        CGFloat(self).formatted
    }
}

А теперь можете сравнить итоговые вьюхи с макетами и проверить на случайные .padding():

That’s all! Now you can compare views in Canvas with the designed in Figma and check on accidental .padding():

YourView()
      .measure()

#howto #getsources #groovy

@swiftui_dev

📹 Переходы между видео в стиле Рилс

📹 Find out how to repeat Reels

Thank you for subscribing and recommending channel… I really appreciate all of you 🫶

P.S. All these videos were captured by me in different subjects of Russia 🇷🇺

#tasty

@swiftui_dev

🎡 Carousel view on SwiftUI

За кодом сюда

Code is here

#tasty

@swiftui_dev

💣 Мобильная разработка разделена между iOS и Android. iOS популярна на Западе, а у Android больше пользователей по всему миру.

Пренебрежение любой платформой означает отказ от большого процента потенциальных пользователей. За редким исключением приложения сначала создаются для iOS, а значит и дизайн разрабатывается сначала для iOS.

В последнее время крупные компании стараются сократить время разработки на обеих платформах. Кроссплатформенная разработка — один из способов сделать это. В моем последнем проекте мы выбрали для этого KMM. Но, будем честны, используя KMM-подход, вы сначала разрабатываете для Android-платформы, а уже потом адаптируете код для iOS. Но есть ли способ делать наоборот? Да, Skip.

Мой демо-проект с использованием Skip здесь.

🧨The mobile development is divided between iOS and Android. iOS is popular in the West, while Android has more worldwide users.

Neglecting either platform means leaving behind a large percentage of potential users. However, apps are generally made for iOS first. Clients ask for an iOS app, then expect a port to the Play Store. Actually companies design for iOS first, then adapt their designs for Android.

However large tech companies really try to reduce the development time on both platforms. Cross-platform is one of the ways to do it. On my last project we choosed KMM for this. But using KMM-approach you firstly develop for Android-platform and after that you adapt code for iOS. Is there any way to do the opposite? Yes, to use a Skip.

My demo project is here.

#getsources #howto #readthis #tasty #groovy

@swiftui_dev

👨🏻‍💻 Настраиваем подключение к гиту

Статью можно найти здесь или здесь

👨🏻‍💻 Configuring git connection

Find out it here or here

Save to not to lose 😊

#readthis

🧨 Как можно эффектно показать рекламу или любое другое view? Весьма неплохой челлендж

За кодом сюда

💭 How to advertise on a specific view? Really nice challenge on SwiftUI

Code is here

#tasty #trytodo

@swiftui_dev

🧭 Quick navigation

#readthis - recommended articles, books, etc
#watchthis - recommended videos, clips, etc
#howto - tutorials, rtfm
#getsources - where the hell are sources? open-source repositories (including my own swift packages #swiftpm), projects
#trytodo - “try to do” challenges, sometimes not easy
#groovy - trending high-rated posts based on statistics (private or public sharing and positive reactions)
#tasty - cool creative features (animations, concepts, etc), might be useful for inspiring developers, designers or PMs

🧭 Быстрая навигация на канале

#readthis - ссылки на статьи, книги и др
#watchthis - ссылки на видео
#howto - воркшопы, обучающие статьи и т п
#getsources - ссылки на проекты с открытым исходным кодом (включая #swiftpm модули)
#trytodo - челенджи, иногда простые, иногда не очень
#groovy - посты с наибольшим количеством шарингов и реакций
#tasty - “посмотри, чтоб вдохновиться”, здесь будут анимации, концепты и т п

🔑 OTP TextField on SwiftUI

За кодом сюда

Code is here

#tasty #groovy

@swiftui_dev

💳 Все больше сервисов на рынке внедряют в свои приложения СБП (сервис быстрых платежей).

Готовое SDK для работы можно найти здесь.

💳 Swift package for the service SBP, more details about SBP you can find here.

#swiftpm #tasty #getsources

@swiftui_dev

🎆 Обновил либу Animatable. Добавил анимации для скелетонов (и для других view). Мелочь, но пользователям будет интерактивнее ☺️

Краткий мануал здесь 📚

🎆 Just updated Animatable. Add shimmers and blinking effect for skeletons or other views. Hope you like it 👍🏻

Quick start is here 👨‍🏫

#swiftpm #tasty #groovy #getsources

@swiftui_dev

Отличная статья на тему подводных камней в использовании UDF архитектур. Одним из таких является нарушение принципа LoB (Locality of Behaviour).

Nice article about pitfalls (e.g. losing the locality of behavior) in using Unidirectional architectures in swift.

#readthis

🥷 👋 Демо использования одного из быстрорастущих подходов в мобильной разработке - Server-Driven UI, как можно быстро поменять ваше приложение без релиза в стор.

Такой подход все больше и больше набирает популярность в особенности в e-commerce.

🖖🏻🤠 Server-Driven UI.

See how to use one of the most efficient and flexible approaches to change your app without releasing in the AppStore.

You can easily tune your views on the server side.

This approach is gaining popularity more and more especially in e-commerce.

Code is here.

#tasty #groovy

@swiftui_dev

👷‍♂️👻Лайфхак для дебага вьюх. Цвет фона меняется при каждой отрисовки вью. Таким образом можно визуально увидеть, насколько часто меняются стэйты.

👾🤖View’s debugging life hack. Background color changes every time view’s rendering. So you can visual analize how often you change states for example.


public extension Color {
static var random: Color {
Color (
red: .random (in: 0...1.0),
green: .random (in: 0...1.0),
blue: .random (in: 0...1.0)
)
}
}

public extension View {
@ViewBuilder
func randomBackgroundColor() -> some View {
background(Color.random)
}
}

#groovy

@swiftui_dev

⚖️ Хорошая либа FluentUI от Microsoft как пример того, как можно хорошо структурировать дизайн-систему

👷‍♂️ Nice package Microsoft's Fluent UI as example how you can organize your design system

#swiftpm #howto #getsources #groovy