SwiftUI dev
1.03K subscribers
87 photos
35 videos
1 file
72 links
Mobile development, SwiftUI, Compose, fell free to reach me: @lexkraev
Download Telegram
This media is not supported in your browser
VIEW IN TELEGRAM
Анимация из рекламы 🍟 Код здесь

Fast food cafe animation (have seen in the commercial) 🍟 Code is here

#tasty #groovy #getsources #trytodo
Font hints 🖖🏻

#groovy
This media is not supported in your browser
VIEW IN TELEGRAM
Навигация

Один из блоков вопросов на iOS - собеседовании - архитектура приложений. При этом почти в любой архитектуре вопросы навигации всегда находятся сбоку от обсуждения. Более того, для навигации разрабатывают свои паттерны. Одними из таких являются координатор и навигатор.

Начиная с SwiftUI 1.0 Apple практически на каждом WWDC рассказывает про работу с MVVM, как будто забывая про роутинг. Да, нам показали NavigationView, NavigationLink, но не покидало ощущение, что Apple опять представили что-то промежуточное. Многие стали писать свои обертки над этим API, чтобы сделать работу удобнее. И наконец в iOS 16 Apple представили новое API навигации, которое так долго ждали.

Вместо NavigationView (deprecated) теперь нужно использовать NavigationStack. Экран для перехода будет определять модификатор navigationDestination.

Будем честны, многие команды до сих пор используют роутинг на UIKit в проектах на SwiftUI. Даже те, кто пытались разобраться в NavigationView, в конечном итоге возвращались обратно в UIKit. С появлением нового API навигации такой подход - поворот не туда. С другой стороны, новое API требует минимальный таргет у проекта iOS 16.0 . Что делать? Использовать бэкпорт! Можете создать свой тестовый проект, чтобы поработать с этой библиотекой. Мой сэмпл здесь.

#switfpm #howto #getsources #groovy
This media is not supported in your browser
VIEW IN TELEGRAM
Сделал package для добавления pull-to-refresh на любое View для iOS 14.0 (Apple-овский аналог доступен только для List, начиная с iOS 15.0)

Made the package for marking any SwiftUI View as refreshable, similar to Apple's refreshable(action:) that available from iOS 15 and only in List 🤷🏼‍♂️.

#swiftpm #groovy #getsources
SwiftUI dev
Сделал package для добавления swipe-меню на любое View для iOS 13.0 (Apple-овский аналог доступен только для List, начиная с iOS 15.0) Made the package for creating swipe actions for any SwiftUI View, similar to Apple's swipeActions(edge:allowsFullSwipe:content:)…
This media is not supported in your browser
VIEW IN TELEGRAM
✌🏻 Обновил package SwipeActions. Напомню, либа добавляет swipe-меню для любых view. У Apple аналог только для List и только с iOS 15.

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

✌🏻 I've just released SwipeActions new version. It allows you to add swiped menu to any SwiftUI view, quite similar to Apple’s one that available from iOS 15 and only for Lists.

Release notes are here.

Quick start is here.

#swiftpm #tasty #groovy #getsources
This media is not supported in your browser
VIEW IN TELEGRAM
🤸🏻‍♂️🤾🏻‍♂️ Сделал package Animatable. Либа позволяет добавить кастомные реакции на нажатия кнопок.

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

Спасибо за репосты 🤝

🤸🏻‍♂️🤾🏻‍♂️ Yet another package Animatable with animation modifiers for buttons . It allows you to add custom reaction on button tapping.

Quick start is here.

Thx for sharing 🤝

#swiftpm #tasty #groovy #getsources
This media is not supported in your browser
VIEW IN TELEGRAM
🍿🪂 Повторим блок “бесконечной” рекламы приложений из App Store.

Код здесь

🙃🎸 Let’s repeat infinite apps ads from the App Store.

Code is here

#tasty #groovy
🎲🗿 SwiftUI Environment values hints

#groovy
This media is not supported in your browser
VIEW IN TELEGRAM
🎢🚁 Слайдер изображений с эффектом page view контроллера.

Код здесь.

🌇🎥 Let's create spectacular image slider with page view controller effect using pure SwiftUI.

Code is here.

#tasty #groovy
Media is too big
VIEW IN TELEGRAM
🖼️🤳 Сториз с 3d переходом между кадрами (поддержка iOS 14+)

За кодом сюда

🖼️🤳 Stories on pure SwiftUI (iOS 14+) with 3d-cube animation for transition between scenes and timer for each slide

Code is here

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

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

#swiftpm #howto #getsources #groovy
This media is not supported in your browser
VIEW IN TELEGRAM
👷‍♂️👻Лайфхак для дебага вьюх. Цвет фона меняется при каждой отрисовки вью. Таким образом можно визуально увидеть, насколько часто меняются стэйты.

👾🤖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
Media is too big
VIEW IN TELEGRAM
🥷 👋 Демо использования одного из быстрорастущих подходов в мобильной разработке - 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
This media is not supported in your browser
VIEW IN TELEGRAM
🎆 Обновил либу 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
This media is not supported in your browser
VIEW IN TELEGRAM
🔑 OTP TextField on SwiftUI

За кодом сюда

Code is here

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

#readthis - ссылки на статьи, книги и др
#watchthis - ссылки на видео
#howto - воркшопы, обучающие статьи и т п
#getsources - ссылки на проекты с открытым исходным кодом (включая #swiftpm модули)
#trytodo - челенджи, иногда простые, иногда не очень
#groovy - посты с наибольшим количеством шарингов и реакций
#tasty - “посмотри, чтоб вдохновиться”, здесь будут анимации, концепты и т п
🧭 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
Media is too big
VIEW IN TELEGRAM
💣 Мобильная разработка разделена между 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
Media is too big
VIEW IN TELEGRAM
🔥 Весьма удобный и крутой лайфхак, как можно быстро помочь себе в верстке

🧨 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