SwiftUI में टेक्स्ट संरेखण: उदाहरणों के साथ पूर्ण गाइड

SwiftUI में टेक्स्ट संरेखण: शुरुआती से विशेषज्ञ तक

क्या आपने कभी स्क्रीन पर घूरते हुए यह समझने की कोशिश की है कि SwiftUI में आपका मल्टी-लाइन टेक्स्ट जिद्दी रूप से बाएँ किनारे से क्यों चिपका रहता है, जबकि आपने स्पष्ट रूप से .center निर्दिष्ट किया था? परिचित दर्द। "SwiftUI text-alignment" प्रश्न Stack Overflow पर हज़ारों व्यूज़ इकट्ठा करता है, यह उन छोटी-छोटी चीज़ों में से एक है जो पूरे इंटरफ़ेस को बर्बाद कर सकती है।

इस लेख में, हम SwiftUI में टेक्स्ट संरेखण को नियंत्रित करने के सभी तरीकों को समझेंगे। मैं आपको न केवल बुनियादी तकनीक दिखाऊंगा, बल्कि वे लाइफ़हैक्स भी दिखाऊंगा जो गूगल करने के घंटे बचाएंगे। चलिए शुरू करते हैं!

1. आधार: .multilineTextAlignment

पहला मॉडिफ़ायर जिसका आप सामना करेंगे, वह है multilineTextAlignment। यह विशेष रूप से मल्टी-लाइन टेक्स्ट के साथ काम करता है, लेकिन वास्तव में सिंगल-लाइन को भी प्रभावित करता है। आइए एक उदाहरण देखें:

import SwiftUI\n\nstruct AlignmentExample: View {\n    var body: some View {\n        VStack(spacing: 20) {\n            Text("यह टेक्स्ट बाएँ किनारे से संरेखित है। SwiftUI में डिफ़ॉल्ट रूप से टेक्स्ट बाईं ओर चिपक जाता है।")\n                .multilineTextAlignment(.leading)\n                .frame(maxWidth: 250)\n                .border(Color.gray)\n            \n            Text("यह टेक्स्ट केंद्र में है। शीर्षकों और उद्धरणों के लिए आदर्श।")\n                .multilineTextAlignment(.center)\n                .frame(maxWidth: 250)\n                .border(Color.gray)\n            \n            Text("यह टेक्स्ट दाएँ किनारे से संरेखित है। अक्सर दाएँ-से-बाएँ लिखी जाने वाली भाषाओं के अंतर्राष्ट्रीयकरण में उपयोग किया जाता है।")\n                .multilineTextAlignment(.trailing)\n                .frame(maxWidth: 250)\n                .border(Color.gray)\n        }\n        .padding()\n    }\n}

महत्वपूर्ण: multilineTextAlignment केवल एक कंटेनर के अंदर काम करता है जो टेक्स्ट की चौड़ाई को सीमित करता है। यदि आप frame निर्दिष्ट नहीं करते हैं, तो टेक्स्ट सभी उपलब्ध चौड़ाई ले लेगा, और संरेखण आपकी अपेक्षा के अनुसार काम नहीं कर सकता है।

2. .leading और .left के बीच अंतर

SwiftUI में .leading, .trailing, .left और .right हैं। क्या अंतर है?

\n
• .leading / .trailing — अनुकूली मान। बाएँ-से-दाएँ लिखी जाने वाली भाषाओं (अंग्रेज़ी, रूसी) में .leading = .left, .trailing = .right। अरबी या हिब्रू में — इसके विपरीत।
\n
• .left / .right — किनारे से कठोर जुड़ाव। लोकेल के आधार पर नहीं बदलता।
\n

Apple अंतर्राष्ट्रीयकरण के समर्थन के लिए .leading और .trailing का उपयोग करने की अनुशंसा करता है। लेकिन यदि आपको "हमेशा बाएँ" चाहिए — तो .left का उपयोग करें।

3. कंटेनरों के अंदर टेक्स्ट संरेखण

अक्सर समस्या स्वयं Text में नहीं होती, बल्कि यह होती है कि यह VStack, HStack या ZStack के अंदर कैसे स्थित है। यहाँ स्टैक्स का alignment पैरामीटर काम में आता है।

3.1. VStack और HStack

struct StackAlignmentExample: View {\n    var body: some View {\n        VStack(alignment: .leading, spacing: 10) {\n            Text("शीर्षक")\n                .font(.title)\n            Text("यह विवरण है, जो शीर्षक के समान बाएँ सीमा से शुरू होना चाहिए। स्टैक के स्पष्ट संरेखण के बिना, टेक्स्ट खिसक सकता है।")\n                .font(.body)\n        }\n        .frame(maxWidth: 300)\n        .padding()\n        .background(Color.yellow.opacity(0.3))\n        .cornerRadius(10)\n    }\n}

लाइफ़हैक: यदि आप चाहते हैं कि VStack के अंदर का सारा टेक्स्ट केंद्र में संरेखित हो, लेकिन प्रत्येक तत्व का अपना संरेखण हो सके — तो स्टैक के alignment और विशिष्ट Text के multilineTextAlignment को मिलाएं।