# TextArea

> word-wrap, ऊर्ध्वाधर रोलिंग, प्रति-पंक्ति आइकन और रोलेबल read-only मोड वाला बहुपंक्ति टेक्स्ट फ़ील्ड।

Source: https://crossfly.dev/hi/docs/ui/widgets/textarea — CrossFly documentation. Full docs as one file: https://crossfly.dev/llms-full.txt

# TextArea

`TextArea` **बहुपंक्ति** टेक्स्ट प्रविष्टि है। आधार [`TextInput`](/docs/ui/widgets/textinput) के ऊपर, यह जोड़ता है: word-wrap, पंक्ति संरचना, ऊर्ध्वाधर रोलिंग, 2D निर्देशांक मैपिंग और बहुपंक्ति layout। यह दाईं ओर आइकन (प्रति दृश्य पंक्ति एक) और एक **रोलेबल read-only मोड** (लंबे टेक्स्ट को दिखाने के लिए जिसे उपयोगकर्ता केवल स्क्रॉल करता है) का समर्थन करता है।

[`TextField`](/docs/ui/widgets/textfield) के विपरीत, `TextArea` में **न मास्क है न पासवर्ड मोड**; `ENTER` पंक्ति विच्छेद डालता है और `getText()` `\n` को संरक्षित रखता है।

> 🟡 · **पैकेज:** `dev.crossfly.ui` · **विस्तार करता है:** `TextInput` · **शैली:** `TextAreaStyle`

## कब उपयोग करें
- टिप्पणियाँ, comments, विवरण, पते — कोई भी **कई पंक्तियों** वाला टेक्स्ट।
- एक लंबा रोलेबल ब्लॉक दिखाना (`editable=false` के साथ)।

## कब उपयोग न करें
- **एक पंक्ति** की प्रविष्टि (नाम, ई-मेल, मान) → [`TextField`](/docs/ui/widgets/textfield) उपयोग करें।
- मास्क / पासवर्ड मोड → [`TextField`](/docs/ui/widgets/textfield) उपयोग करें (`TextArea` इनका समर्थन नहीं करता)।

## रूप-रंग
`TextAreaStyle` की पृष्ठभूमि/बॉर्डर वाला आयत, पंक्तियों में टूटा हुआ टेक्स्ट (आंतरिक चौड़ाई पर word-wrap), सामग्री के ऊँचाई से अधिक होने पर ऊर्ध्वाधर रोलिंग के साथ। पसंदीदा ऊँचाई `rowCount` (दृश्य पंक्तियों की संख्या) × पंक्ति ऊँचाई + `ingap` से आती है। दाईं ओर के आइकन, जब परिभाषित हों, अपना एक स्तंभ लेते हैं, प्रति दृश्य पंक्ति एक।

``

## पूरा उदाहरण (कॉपी करें, पेस्ट करें और चलाएँ)
```java
package com.exemplo;

import dev.crossfly.ui.*;
import dev.crossfly.ui.layout.*;

/** चलाने योग्य मुख्य स्क्रीन। launcher (classname) की ओर संकेत करें और चलाएँ: gradlew :lwjgl3:run */
public class MainWindow extends Window
{
   @Override
   public void onShow() throws Exception
   {
      super.onShow();
      setLayout(new VerticalLayout());

      // बहु-पंक्ति फ़ील्ड; LAY_FILL स्क्रॉल क्षेत्र को ऊँचाई देता है
      TextArea obs = new TextArea().caption("Observações");
      add(LAY_FILL, obs);

      // आउटपुट Label
      Label saida = new Label("Escreva algo e toque em Enviar");
      add(LAY_AUTO, saida);

      // हर कुंजी पर onChange नहीं है: भेजते समय getText() पढ़ें (\n संरक्षित रखता है)
      Button enviar = new Button("Enviar")
         .onAction(c -> saida.setText("Você escreveu " + obs.getText().length() + " caracteres"));
      add(LAY_AUTO, enviar);
   }
}
```

> नीचे के अंश **केवल मूल भाग** दिखाते हैं (जो `onShow()` के अंदर जाता है)। चलाने के लिए, उन्हें ऊपर दिए `MainWindow` कंकाल में रखें।

## बुनियादी उपयोग
```java
TextArea obs = new TextArea().caption("Observações");
container.add(0.4f, obs);
// ...
String texto = obs.getText();   // \n संरक्षित रखता है
```

## Constructors
| Constructor | विवरण |
|---|---|
| `TextArea()` | खाली |
| `TextArea(String text)` | प्रारंभिक टेक्स्ट के साथ (`\r\n`/`\r` को `\n` में सामान्यीकृत) |

## गुण और अनुकूलन
| गुण / विधि | प्रकार | डिफ़ॉल्ट | क्या करता है |
|---|---|---|---|
| `text(String)` / `setText(String)` | `TextArea` / `void` | — | टेक्स्ट सेट करता है (विच्छेद सामान्यीकृत करता है; cursor आरंभ में) |
| `getText()` | `String` | — | कच्चा टेक्स्ट, `\n` संरक्षित करते हुए |
| `caption(String)` | `TextArea` (fluente) | `null` | placeholder |
| `rightIcons(Icon...)` | `TextArea` (fluente) | — | दाईं ओर आइकन, प्रति दृश्य पंक्ति एक |
| `rightIconAction(int row, Action)` | `TextArea` (fluente) | — | पंक्ति `row` (0-based) के आइकन की क्रिया |
| `clearText()` | `void` | — | पूरा टेक्स्ट साफ़ करता है |
| `getNumberOfTextLines()` | `int` | — | कुल तार्किक पंक्तियाँ (word-wrapped) |
| `scrollToTop()` / `scrollToBottom()` / `scrollToLine(int)` | `void` | — | प्रोग्रामेटिक रोलिंग |
| शैली `.rowCount(int)` | `int` | — | दृश्य पंक्तियों की संख्या (पसंदीदा ऊँचाई परिभाषित करती है) |
| शैली `.maxLength(int)` | `int` | `0` (असीमित) | वर्ण सीमा |
| शैली `.validChars(String)` | `String` | `null` | अनुमत वर्ण (`\n` हमेशा स्वीकृत) |
| शैली `.editable(false)` | `boolean` | `true` | रोलेबल read-only |
| शैली `.spaceBetweenLines(int)` | `int` | — | पंक्तियों के बीच अतिरिक्त स्थान |

## Callbacks और घटनाएँ
| Callback | कब ट्रिगर होता है |
|---|---|
| `onAction(Action)` (विरासत में) | `onTouchUp` में, कीबोर्ड खुलने के बाद |
| `onFocus()` / `onBlur()` (विरासत में) | फ़ोकस प्राप्ति / हानि |
| `rightIconAction(row, Action)` | उस पंक्ति के आइकन को स्पर्श (और छोड़ने) पर |

## अवस्थाएँ
- **focused:** cursor झपकता है, स्पर्श पर कीबोर्ड खुलता है; ↑/↓ तीर पंक्तियों के बीच नेविगेट करते हैं।
- **selection:** खींचकर 2D चयन; long-touch सब कुछ चुनता है और `ActionSheet` खोलता है।
- **read-only (`editable=false`):** cursor/संपादन रहित; खींचना सामग्री को **रोल** करता है; माउस व्हील भी रोल करता है।

### सीमा वाला टिप्पणी फ़ील्ड
```java
TextArea obs = new TextArea().caption("Observações");
obs.style(Styles.theme()
   .textArea(State.NORMAL)
   .rowCount(4)
   .maxLength(500));
container.add(LAY_AUTO, obs);
```

### केवल-पठन, रोलेबल टेक्स्ट ब्लॉक
```java
TextArea termos = new TextArea(textoDosTermos);
termos.style(Styles.theme()
   .textArea(State.NORMAL)
   .editable(false)      // सिर्फ़ स्क्रॉल, संपादन नहीं
   .rowCount(8));
container.add(LAY_FILL, termos);
termos.scrollToTop();
```

### दाईं ओर क्रिया आइकन वाली पंक्तियाँ
```java
TextArea lista = new TextArea("Item A\nItem B\nItem C");
lista.rightIcons(
   new MaterialIcon(""),   // पंक्ति 0 पर "delete"
   new MaterialIcon(""),
   new MaterialIcon(""));
lista.rightIconAction(0, c -> removerLinha(0));
container.add(0.3f, lista);
```

## अच्छे अभ्यास
- दृश्य ऊँचाई नियंत्रित करने के लिए शैली में `rowCount` परिभाषित करें; layout में `LAY_AUTO` के साथ संयोजित करें।
- संपादन के बिना लंबा टेक्स्ट दिखाने के लिए `editable(false)` उपयोग करें — खींचना चयन के बजाय रोल करने लगता है।
- persist करने के लिए `getText()` उपयोग करें (`\n` संरक्षित करता है); `\r\n` का सामान्यीकरण प्रविष्टि पर पहले ही हो जाता है।

## सामान्य गलतियाँ
- **मास्क या पासवर्ड मोड की अपेक्षा करना:** `TextArea` इनका समर्थन नहीं करता — [`TextField`](/docs/ui/widgets/textfield) उपयोग करें।
- **बहुत सारे `rightIcons` परिभाषित करना:** केवल `visibleRows` (दृश्य पंक्तियों की संख्या) तक ही चित्रित होते हैं; इससे अधिक आइकन अनदेखे रहते हैं।

## यह भी देखें
- क्षेत्र गाइड: [`ui/`](/docs/ui) · रेसिपी: [`cookbook/`](/docs/cookbook)
- अवधारणा (फ़ोकस, चयन, scroll): [`concepts/`](/docs/concepts)
- संबंधित घटक: [`TextInput`](/docs/ui/widgets/textinput) · [`TextField`](/docs/ui/widgets/textfield) · [`Keypad`](/docs/ui/widgets/keypad)
