SwiftUI, UIKit ve AppKit ile ipucu görünümleri oluşturma ve özelleştirme.
TipView
Yapı | TipKit
*iOS 17.0+, iPadOS 17.0+, Mac Catalyst 17.0+, macOS 14.0+, tvOS 17.0+, visionOS 1.0+, watchOS 10.0+*
Satır içi (inline) bir ipucu temsil eden kullanıcı arayüzü öğesi.
@MainActor @preconcurrency struct TipView<Content> where Content : Tip
Bir ipucu görünümü; Tip protokolüne uygun bir ipucu, isteğe bağlı bir ok kenarı ve eylem işleyicisi sağlayarak oluşturulur. Ok kenarı, ipucundan uzağa doğru işaret eden yönlü bir oktur.
Önemli: UIView ve NSView hiyerarşilerine ipuçları eklerken TipUIView ve TipNSView kullanın.
import SwiftUI
import TipKit
struct SampleTip: Tip {
var title: Text { Text("Favori Olarak Kaydet") }
var message: Text? { Text("Favori bahçeleriniz her zaman listenin en üstünde görünür.") }
var image: Image? { Image(systemName: "star") }
}
struct SampleView: View {
var tip = SampleTip()
var body: some View {
VStack {
TipView(tip, arrowEdge: .bottom)
}
}
}
Başlatıcılar
// Temel başlatıcı
init(_ tip: (any Tip)?, arrowEdge: Edge? = nil,
action: @escaping (Tips.Action) -> Void = { _ in })
// isPresented bağlantılı (iOS 26+)
init(_ tip: (any Tip)?, isPresented: Binding<Bool>? = nil,
arrowEdge: Edge? = nil,
action: @escaping (Tips.Action) -> Void = { _ in })
// anchorID'li (iOS 26+)
init<AnchorID>(_ tip: (any Tip)?, isPresented: Binding<Bool>? = nil,
arrowEdge: Edge? = nil, anchorID: AnchorID,
action: @escaping (Tips.Action) -> Void = { _ in })
Parametreler:
| Parametre | Açıklama | | --- | --- | | tip | Görüntülenecek ipucu | | arrowEdge | Okun görüntüleneceği kenar | | isPresented | İpucunun görüntüleme durumunu kontrol eden bağlantı (Binding). nil ise ipucu durumuna göre otomatik kaybolur | | anchorID | Bağlandığı görünümün sınırlarını okumak için kullanılan tanımlayıcı | | action | Kullanıcı ipucu eylemini tetiklediğinde çalışacak closure |
Uyum: View
popoverTip
Görünüm Değiştirici | SwiftUI
*iOS 17.0+, iPadOS 17.0+, Mac Catalyst 17.0+, macOS 14.0+, tvOS 17.0+, visionOS 1.0+*
Değiştirilen görünüm üzerinde popover tarzında ipucu sunar.
func popoverTip(_ tip: (any Tip)?, arrowEdge: Edge? = nil,
action: @escaping (Tips.Action) -> Void = { _ in }) -> some View
İpucu görüntülenmeye uygun hale geldiğinde mevcut bir görünüm üzerinde popover olarak sunar:
struct SampleView: View {
var tip = SampleTip()
var body: some View {
Image(systemName: "star")
.popoverTip(tip)
}
}
İlgili görünüm değiştiriciler:
tipBackground(_:)— İpucu arka planıtipCornerRadius(_:antialiased:)— Köşe yarıçapıtipImageSize(_:)— Görsel boyututipViewStyle(_:)— Görünüm stilitipImageStyle(_:)— Görsel stili
UIKit Görünümleri
TipUIView
Sınıf | TipKit
*iOS 17.0+, iPadOS 17.0+, Mac Catalyst 17.0+, visionOS 1.0+*
UIKit uygulamalarında ipucu temsil eden UIView alt sınıfı.
@MainActor @objc @preconcurrency final class TipUIView
İpucunun eklenmesi ve kaldırılması, ipucunun shouldDisplayUpdates veya statusUpdates özelliğini dinleyerek yapılır:
class CatTracksViewController: UIViewController {
private var catTracksFeatureTip = CatTracksFeatureTip()
private var tipObservationTask: Task<Void, Never>?
private weak var tipView: TipUIView?
override func viewDidAppear(_ animated: Bool) {
super.viewDidAppear(animated)
tipObservationTask = tipObservationTask ?? Task { @MainActor in
for await shouldDisplay in catTracksFeatureTip.shouldDisplayUpdates {
if shouldDisplay {
let tipHostingView = TipUIView(catTracksFeatureTip)
tipHostingView.translatesAutoresizingMaskIntoConstraints = false
view.addSubview(tipHostingView)
tipView = tipHostingView
} else {
tipView?.removeFromSuperview()
tipView = nil
}
}
}
}
}
Başlatıcı:
init(_ tip: any Tip, arrowEdge: Edge? = nil,
actionHandler: @escaping (Tips.Action) -> Void = { _ in })
Özellikler:
| Özellik | Tip | Açıklama | | --- | --- | --- | | backgroundColor | UIColor? | İpucu görünümünün arka plan rengi | | backgroundStyle | any ShapeStyle | Arka plan stili (iOS 26+) | | cornerRadius | CGFloat | Köşe yarıçapı | | imageSize | CGSize | Görselin boyutu | | imageStyle | (any ShapeStyle)? | Görsel ön plan stili (iOS 18+) | | viewStyle | any TipViewStyle | Tip görünüm stili |
TipUIPopoverViewController
Sınıf | TipKit
*iOS 17.0+, iPadOS 17.0+, Mac Catalyst 17.0+, visionOS 1.0+*
UIKit uygulamalarında popover ipucu görüntüleyen görünüm denetleyicisi.
@MainActor @objc @preconcurrency final class TipUIPopoverViewController
UIPopoverPresentationController kullanarak popover olarak sunum yapar:
class CatTracksViewController: UIViewController {
@IBOutlet weak var catTracksFeatureButton: UIButton!
private var catTracksFeatureTip = CatTracksFeatureTip()
override func viewDidAppear(_ animated: Bool) {
super.viewDidAppear(animated)
Task { @MainActor in
for await shouldDisplay in catTracksFeatureTip.shouldDisplayUpdates {
if shouldDisplay {
let popoverController = TipUIPopoverViewController(
catTracksFeatureTip,
sourceItem: catTracksFeatureButton
)
present(popoverController, animated: animated)
} else {
if presentedViewController is TipUIPopoverViewController {
dismiss(animated: animated)
}
}
}
}
}
}
Başlatıcı:
convenience init(_ tip: any Tip,
sourceItem: any UIPopoverPresentationControllerSourceItem,
actionHandler: @escaping (Tips.Action) -> Void = { _ in })
Ek özellikler: sourceItem, presentationDelegate
TipUICollectionViewCell
Sınıf | TipKit
*iOS 17.0+, iPadOS 17.0+, Mac Catalyst 17.0+, visionOS 1.0+*
İpucu gömülen koleksiyon görünümü hücresi.
@MainActor @objc @preconcurrency final class TipUICollectionViewCell
Hücreyi yapılandırmak için configureTip(_:arrowEdge:actionHandler:) kullanılır:
func collectionView(_ collectionView: UICollectionView,
cellForItemAt indexPath: IndexPath) -> UICollectionViewCell {
if indexPath.section == 0,
let cell = collectionView.dequeueReusableCell(
withReuseIdentifier: "TipUICollectionViewCell",
for: indexPath) as? TipUICollectionViewCell {
cell.configureTip(catTracksFeatureTip)
return cell
}
}
TipUICollectionReusableView
Sınıf | TipKit
*iOS 17.0+, iPadOS 17.0+, Mac Catalyst 17.0+, visionOS 1.0+*
İpucu temsil eden UICollectionReusableView alt sınıfı. configureTip(_:arrowEdge:actionHandler:) ile yapılandırılır.
AppKit Görünümleri
TipNSView
Sınıf | TipKit
*macOS 14.0+*
AppKit uygulamalarında ipucu temsil eden NSView alt sınıfı.
@MainActor @objc @preconcurrency final class TipNSView
class CatTracksViewController: NSViewController {
private var catTracksFeatureTip = CatTracksFeatureTip()
private var tipObservationTask: Task<Void, Never>?
private weak var tipView: TipNSView?
override func viewDidAppear() {
super.viewDidAppear()
tipObservationTask = tipObservationTask ?? Task { @MainActor in
for await shouldDisplay in catTracksFeatureTip.shouldDisplayUpdates {
if shouldDisplay {
let tipHostingView = TipNSView(catTracksFeatureTip)
view.addSubview(tipHostingView)
tipView = tipHostingView
} else {
tipView?.removeFromSuperview()
tipView = nil
}
}
}
}
}
Başlatıcı:
convenience init(_ tip: any Tip, arrowEdge: Edge? = nil,
actionHandler: @escaping (Tips.Action) -> Void = { _ in })
Özellikler: backgroundColor: NSColor?, backgroundStyle, cornerRadius, imageSize, imageStyle, viewStyle
TipNSPopover
Sınıf | TipKit
*macOS 14.0+*
AppKit uygulamalarında popover ipucu görüntüleyen NSPopover alt sınıfı.
@MainActor @objc @preconcurrency final class TipNSPopover
class CatTracksViewController: NSViewController {
@IBOutlet weak var catTracksFeatureButton: NSButton!
private var tipPopover: TipNSPopover?
override func viewDidAppear() {
super.viewDidAppear()
Task { @MainActor in
for await shouldDisplay in catTracksFeatureTip.shouldDisplayUpdates {
if shouldDisplay {
tipPopover = TipNSPopover(catTracksFeatureTip)
tipPopover?.show(relativeTo: catTracksFeatureButton.bounds,
of: catTracksFeatureButton, preferredEdge: .minY)
} else {
tipPopover?.close()
tipPopover = nil
}
}
}
}
}
Başlatıcı:
required init(_ tip: any Tip, delegate: (any NSPopoverDelegate)? = nil,
actionHandler: @escaping (Tips.Action) -> Void = { _ in })
Özellikler: backgroundColor: NSColor?, backgroundStyle, cornerRadius, imageSize, imageStyle, viewStyle
Görünüm Stilleri
TipViewStyle Protokolü
Protokol | TipKit
*iOS 17.0+, iPadOS 17.0+, Mac Catalyst 17.0+, macOS 14.0+, tvOS 17.0+, visionOS 1.0+, watchOS 10.0+*
Görünüm hiyerarşisindeki tüm ipuçlarına özel görünüm uygulayan tip.
@MainActor @preconcurrency protocol TipViewStyle
Özel bir TipViewStyle oluşturarak ipuçlarınızın düzenini ve stilini özelleştirin:
struct HeadlineTipViewStyle: TipViewStyle {
func makeBody(configuration: TipViewStyle.Configuration) -> some View {
VStack(alignment: .leading) {
HStack {
Text("İPUCU").font(.system(.headline).smallCaps())
Spacer()
Button(action: { configuration.tip.invalidate(reason: .tipClosed) }) {
Image(systemName: "xmark").scaledToFit()
}
}
Divider().frame(height: 1.0)
HStack(alignment: .top) {
configuration.image?
.resizable()
.aspectRatio(contentMode: .fit)
.frame(width: 48.0, height: 48.0)
VStack(alignment: .leading, spacing: 8.0) {
configuration.title?.font(.headline)
configuration.message?.font(.subheadline)
ForEach(configuration.actions) { action in
Button(action: action.handler) {
action.label().foregroundStyle(.blue)
}
}
}
}
}
}
}
Stili uygulamak için:
// SwiftUI
TipView(AddWorkoutTip())
.tipViewStyle(HeadlineTipViewStyle())
// UIKit / AppKit
let tipView = TipUIView(AddWorkoutTip())
tipView.viewStyle = HeadlineTipViewStyle()
Gerekli yöntem:
func makeBody(configuration: Self.Configuration) -> Self.Body
İlişkili tip: Body : View
Tip takma adı: Configuration = TipViewStyleConfiguration
Yerleşik stil: static var miniTip: MiniTipViewStyle
TipViewStyleConfiguration
Yapı | TipKit
İpucu yapılandırmasını tutan konteyner tipi.
struct TipViewStyleConfiguration
| Özellik | Tip | Açıklama | | --- | --- | --- | | tip | any Tip | İpucu örneği | | title | Text? | İpucu başlığı | | message | Text? | İpucu mesajı | | image | Image? | İpucu görseli | | actions | [Tips.Action] | İpucu eylemleri |
MiniTipViewStyle
Yapı | TipKit
*iOS 17.0+, iPadOS 17.0+, Mac Catalyst 17.0+, macOS 14.0+, tvOS 17.0+, visionOS 1.0+, watchOS 10.0+*
TipView için varsayılan stil.
@MainActor @preconcurrency struct MiniTipViewStyle
Uyum: TipViewStyle