Push-Nachrichten von MacTechNews.de
Würden Sie gerne aktuelle Nachrichten aus der Apple-Welt direkt über Push-Nachrichten erhalten?
Forum>Entwickler>Frage an die Software-Entwickler zu NSAttributedString

Frage an die Software-Entwickler zu NSAttributedString

X-Jo26.06.2320:48
Ich möchte in einer View einen umrahmten/unterlegten Text darstellen, wie in der Apple Karten-App:



Ich habe mit alle relevanten Textattributen (insbesondere NSStrokeColorAttributeName und NSStrokeWidthAttributeName) experimentiert, bekomme aber kein adäquates Ergebnis hin.

Weiß jemand, ob das mit NSAttributedString überhaupt geht, oder wie Apple das wohl macht?
0

Kommentare

Paperflow
Paperflow26.06.2321:07
NSStrokeWidthAttributeName allein wird nicht ausreichen.

Eine Möglichkeit, dies zu erreichen, besteht darin, eine Kombination von Attributen zu verwenden, einschließlich NSBackgroundColorAttributeName, NSForegroundColorAttributeName, NSStrokeColorAttributeName und NSStrokeWidthAttributeName. Hier ist ein Beispielcode, der den gewünschten Effekt näher bringen könnte:

```swift
let text = "Dein  Text hier"
let attributedString = NSMutableAttributedString(string: text)

// Textfarbe und Hintergrundfarbe setzen
let foregroundColor = UIColor.white
let backgroundColor = UIColor.blue
attributedString.addAttribute(NSForegroundColorAttributeName, value: foregroundColor, range: NSRange(location: 0, length: attributedString.length))
attributedString.addAttribute(NSBackgroundColorAttributeName, value: backgroundColor, range: NSRange(location: 0, length: attributedString.length))

// Umrahmung hinzufügen
let strokeColor = UIColor.black
let strokeWidth: CGFloat = -3.0
attributedString.addAttribute(NSStrokeColorAttributeName, value: strokeColor, range: NSRange(location: 0, length: attributedString.length))
attributedString.addAttribute(NSStrokeWidthAttributeName, value: strokeWidth, range: NSRange(location: 0, length: attributedString.length))

// Label oder Textansicht erstellen und das Attribut-String setzen
// label.attributedText = attributedString
// textView.attributedText = attributedString
```
„🎸“
0
X-Jo27.06.2319:12
Danke für den Code. Genau so hatte ich das (in Objective-C) schon gemacht. Das Ergebnis sah/sieht so aus:



Font: System, Weight: Bold, Size: 48.0 (nur dass man die Details besser sieht).

Kommt leider bei weitem nicht ans Original ran.
0
X-Jo27.06.2320:49
Ha, fast perfekt:



Habe den Text zweimal an der gleichen Stelle gezeichnet. Einmal mit Stroke Width -20.0 und darüber noch mal mit Stroke Width 0.0:

NSString            *text = @"Café Parkstüble";
    
NSFont    *font = [NSFont systemFontOfSize:48.0 weight:NSFontWeightBold];
    
NSMutableDictionary    *attributes = [NSMutableDictionary dictionary];
    
[attributes setObject:[NSColor darkGrayColor] forKey:NSForegroundColorAttributeName];
    
[attributes setObject:font forKey:NSFontAttributeName];
[attributes setObject:[NSColor whiteColor] forKey:NSStrokeColorAttributeName];
[attributes setObject:[NSNumber numberWithFloat:-20.0] forKey:NSStrokeWidthAttributeName];
        
[text drawAtPoint:CGPointMake(30.0, 100.0) withAttributes:attributes];
    
[attributes setObject:[NSNumber numberWithFloat:0.0] forKey:NSStrokeWidthAttributeName];
    
[text drawAtPoint:CGPointMake(30.0, 100.0) withAttributes:attributes]; 
0
Paperflow
Paperflow27.06.2322:01
Cool. Freut mich!
„🎸“
0
karsten_briksoftware28.06.2306:02
Alternativ könntest du es mit einem weißen NSShadow versuchen.
0
M.Z.28.06.2310:00
Die korrekte Lösung wäre mit SwiftUI so:

import SwiftUI

struct ContentView: View {
    var body: some View {
        ZStack {
             Color(red: 0xDD/255, green: 0x00/255, blue: 0x00/255)
                .edgesIgnoringSafeArea(.all)
            
            Text("Dein Text")
                .padding()
                .font(.system(size: 100, weight: .bold))
                .shadow(color: .white, radius: 3, x: -5, y: -5)
                .shadow(color: .white, radius: 3, x: 5, y: 5)
                .shadow(color: .white, radius: 3, x: -5, y: 5)
                .shadow(color: .white, radius: 3, x: 5, y: -5)
        }
    }
}

Das Shadow habe ich 4x wiederholt, jeweils mit 5 Pixel in jede Richtung, dadurch erhält man einen sehr gleichmässigen Effekt.

0
X-Jo28.06.2310:55
Vielen Dank für die Tipps. Ihr habt mir sehr geholfen!

Mit NSShadow hatte ich schon experimentiert, aber nicht an einen Stack mit 4 Richtungen gedacht. Werde mal versuchen, das in Objective-C zu realisieren.
0

Kommentieren

Diese Diskussion ist bereits mehr als 3 Monate alt und kann daher nicht mehr kommentiert werden.