SwiftUI Academy · บทเรียน

การแสดง Text บนหน้าจอ

สร้างและตกแต่ง View แรกด้วย Text

บทเรียน 2 จาก 413 ขั้นตอน

การแสดง Text บนหน้าจอ เป็นบทเรียน SwiftUI Academy ฟรีบน CoddyKit นี่คือบทเรียนที่ 2 จากทั้งหมด 4 บทเรียน คุณสามารถอ่านบทเรียนทั้งหมดด้านล่างฟรี — จากนั้นลองปฏิบัติด้วยตัวคุณเองในเบราว์เซอร์พร้อมตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7 บทเรียนนี้เป็นส่วนหนึ่งของเส้นทางการเรียน SwiftUI Academy และความก้าวหน้าของคุณจะซิงค์ข้ามเว็บและแอป CoddyKit คอร์ส SwiftUI Academy มีบทเรียนทั้งหมด 4 บทเรียน

บางส่วนของบทเรียนนี้ยังไม่ได้รับการแปล และแสดงเป็นภาษาอังกฤษ

Meet the Text View

The Text view is how you put words on screen. It is the simplest, most-used view in all of SwiftUI. ✍️

Your First Text

Create a Text view by passing a string in parentheses. SwiftUI shows exactly what you put inside the quotes.

Text("Hello, SwiftUI!")

Text Lives in the body

You place a Text view inside your view's body, and it appears centered on screen by default.

var body: some View {
    Text("Welcome aboard")
}

Showing a Variable

You can pass a variable instead of a literal. The text updates automatically to match the value you give it.

let name = "Sam"
Text(name)

String Interpolation

Mix values into a string with interpolation using a backslash and parentheses. It is perfect for greetings and counts.

let count = 3
Text("You have \(count) tasks")

Making Text Bigger

Use the font modifier to change size. Apple gives you semantic sizes like title and headline that adapt nicely.

Text("Big News")
    .font(.title)

Bold and Heavy Text

Add weight with the bold modifier to make important words stand out from the rest.

Text("Important")
    .bold()

Coloring Your Text

Change the color with foregroundStyle. Pick a system color like blue or red, or use your own.

Text("On sale")
    .foregroundStyle(.red)

Text Is Smart About Size

A Text view sizes itself to fit its words. It takes only the space it needs, never more, unless you tell it otherwise.

Empty and Long Text

An empty string shows nothing, and very long text wraps onto multiple lines automatically. Text is forgiving by default. 👍

Text Stays Localizable

A plain string literal in Text is treated as a localized key. This makes translating your app later much easier. 🌍

Quick Check

Let's check how you put a custom color on text.

Recap: Displaying Text

The Text view shows strings, variables, and interpolated values. Style it with font, bold, and foregroundStyle, and it sizes itself automatically. 🎉

เริ่มต้นได้ฟรี

เรียนรู้ Swift ด้วย AI tutor — ฟรี

เขียนและเรียกใช้โค้ดจริงในเบราว์เซอร์ของคุณ รับความช่วยเหลือทันทีจาก AI tutor 24/7 และเรียนรู้ต่อจากที่คุณหยุดบนเว็บหรือในแอป

คอร์ส
30
บทเรียน
120

คำถามที่พบบ่อย

บทเรียน “การแสดง Text บนหน้าจอ” ฟรีหรือไม่

ใช่ — ข้อความเต็มของ “การแสดง Text บนหน้าจอ” ฟรีให้อ่านที่นี่บนเว็บ เพื่อปฏิบัติแบบโต้ตอบ (ตัวแก้ไขโค้ดในตัวและติวเตอร์ AI ตลอด 24/7) และปลดล็อคส่วนที่เหลือของคอร์ส SwiftUI Academy ให้อัปเกรดเป็น CoddyKit PRO คอร์ส SwiftUI Academy มีบทเรียนทั้งหมด 4 บทเรียน

คุณจะเรียนรู้อะไรในบทเรียน “การแสดง Text บนหน้าจอ”

สร้างและตกแต่ง View แรกด้วย Text คุณปฏิบัติ SwiftUI Academy ด้วยโค้ดที่ใช้งานได้จริงที่คุณเรียกใช้โดยตรงในเบราว์เซอร์ และติวเตอร์ AI ตลอด 24/7 ตอบคำถามของคุณขณะที่คุณไปผ่านบทเรียน

คุณต้องมีประสบการณ์ก่อนที่จะเริ่มเรียน SwiftUI Academy หรือไม่

ไม่จำเป็นต้องมีประสบการณ์มาก่อน SwiftUI Academy บน CoddyKit ออกแบบมาสำหรับผู้เริ่มต้นไปจนถึงผู้เรียนขั้นสูง คุณสามารถเริ่มต้นที่นี่หรือเริ่มจากตัวแรกและเรียนด้วยความเร็วของคุณเอง นี่คือบทเรียนที่ 2 จากทั้งหมด 4 บทเรียน

บทเรียน “การแสดง Text บนหน้าจอ” ใช้เวลานานแค่ไหน

บทเรียน CoddyKit ส่วนใหญ่ใช้เวลาประมาณ 5–10 นาที แต่ละบทเรียนจึงสั้นและเป็นแบบโต้ตอบ คุณสามารถก้าวหน้าอย่างต่อเนื่องและกลับมาเรียนต่อจากตรงที่เพิ่งหยุดบนเว็บและแอปได้เลย

ฉันเขียนและรันโค้ดในบทเรียน SwiftUI Academy นี้ได้ไหม

ได้ บทเรียน SwiftUI Academy ทุกบทมีตัวแก้ไขโค้ดในตัว คุณจึงเขียนและรันโค้ดจริงได้เลยในเบราว์เซอร์ และได้รับข้อเสนอแนะจาก AI ในทันที — ไม่ต้องติดตั้งในเครื่องของคุณ

บทเรียนทั้งหมดในหลักสูตรนี้

  1. View คืออะไร
  2. การแสดง Text บนหน้าจอ
  3. ทำความรู้จักตัวปรับแต่ง View
  4. การอ่านลำดับชั้นของ View
← กลับไปที่ SwiftUI Academy