الفرق بين المراجعتين ل"ReactNative/keyboardavoidingview"
اذهب إلى التنقل
اذهب إلى البحث
(إضافة الصّفحة) |
|||
| سطر 10: | سطر 10: | ||
</KeyboardAvoidingView>; | </KeyboardAvoidingView>; | ||
</syntaxhighlight> | </syntaxhighlight> | ||
| + | [[ملف:exampleKeyboard.gif|مركز|لاإطار]] | ||
| − | |||
| − | |||
== الخاصيات == | == الخاصيات == | ||
| − | يرث خاصيّات المكوّن View. | + | يرث خاصيّات المكوّن <code>[[ReactNative/view|View]]</code>. |
===<code>behavior</code>=== | ===<code>behavior</code>=== | ||
| سطر 24: | سطر 23: | ||
!مطلوب | !مطلوب | ||
|- | |- | ||
| − | |enum('height', 'position', 'padding') | + | |<code>enum('height', 'position', 'padding')</code> |
|لا | |لا | ||
|} | |} | ||
| سطر 39: | سطر 38: | ||
|} | |} | ||
===<code>enabled</code>=== | ===<code>enabled</code>=== | ||
| − | + | تفعيل أو تعطيل مكوّن <code>KeyboardAvoidingView</code>، القيمة الافتراضيّة هي <code>true</code>. | |
{| class="wikitable" | {| class="wikitable" | ||
!النوع | !النوع | ||
| سطر 48: | سطر 47: | ||
|} | |} | ||
===<code>keyboardVerticalOffset</code>=== | ===<code>keyboardVerticalOffset</code>=== | ||
| − | هذه هي المسافة بين الجزء العلوي من شاشة المستخدم وعرض react native، قد تكون غير صفرية (non-zero) في بعض حالات الاستخدام. القيمة الافتراضية هي 0. | + | هذه هي المسافة بين الجزء العلوي من شاشة المستخدم وعرض react native، قد تكون غير صفرية (non-zero) في بعض حالات الاستخدام. القيمة الافتراضية هي <code>0</code>. |
| + | [[تصنيف:ReactNative]] | ||
{| class="wikitable" | {| class="wikitable" | ||
!النوع | !النوع | ||
| سطر 60: | سطر 60: | ||
== مصادر == | == مصادر == | ||
* [https://facebook.github.io/react-native/docs/keyboardavoidingview صفحة KeyboardAvoidingView في توثيق React Native الرسمي.] | * [https://facebook.github.io/react-native/docs/keyboardavoidingview صفحة KeyboardAvoidingView في توثيق React Native الرسمي.] | ||
| − | |||
مراجعة 15:37، 9 نوفمبر 2019
مكوّنٌ لحل مشكلة العروض التي تحتاج للنّقل بعيدا عن لوحة المفاتيح الوهميّة. يمكن للمكوّن ضبط ارتفاعه أو موضعه أو حشوته السفلية (bottom padding) تلقائيًا بناءً على موقع لوحة المفاتيح.
مثال
import {KeyboardAvoidingView} from 'react-native';
<KeyboardAvoidingView style={styles.container} behavior="padding" enabled>
... your UI ...
</KeyboardAvoidingView>;
الخاصيات
يرث خاصيّات المكوّن View.
behavior
حدّد كيفية التفاعل مع وجود لوحة المفاتيح.
ملاحظة: يتفاعل كل من Android و iOS مع هذه الخاصية بشكل مختلف. قد يتصرف Android بشكل أفضل عند عدم تعيين خاصيّة behavior، في حين يتصرف iOS عكس ذلك.
| النوع | مطلوب |
|---|---|
enum('height', 'position', 'padding')
|
لا |
contentContainerStyle
نمط عرض حاوية المحتوى (content container) عندما تكون قيمة الخاصيّة behavior القيمةَ 'position'.
| النوع | مطلوب |
|---|---|
| View.style | لا |
enabled
تفعيل أو تعطيل مكوّن KeyboardAvoidingView، القيمة الافتراضيّة هي true.
| النوع | مطلوب |
|---|---|
| قيمة منطقيّة | لا |
keyboardVerticalOffset
هذه هي المسافة بين الجزء العلوي من شاشة المستخدم وعرض react native، قد تكون غير صفرية (non-zero) في بعض حالات الاستخدام. القيمة الافتراضية هي 0.
| النوع | مطلوب |
|---|---|
| عدد | لا |