Relative to Other ViewsYouTube↗  IA↗(long shot)
Education  180K views 93 likes 0 dislikes   26 May 2015
Udacity 651K subscribers United States YouTube↗


Please select the problem
You must specify your email and describe the problem in detail
Describe your problem in detail if it's not obvious

Click to Play Video Click to Play Video
Cuando colocas a los hijos en la vista de otros hijos,
عند نسب موضع واجهات ‫تابعة لواجهات شقيقة لها..
puedes añadir limitaciones en su posición.
يمكنك إضافة بعض القيود على موضعهم
Por ejemplo, una vista de texto debe estar encima de otra vista de texto
مثلًا، يجب أن تكون واجهة ‫نص معينة فوق واجهة نص أخرى
o una vista de imagen debe estar a la izquierda de otra vista de texto.
أو يجب أن تكون واجهة صورة ‫معينة على يسار واجهة نص أخرى
Todas estas limitaciones me recuerdan que tengo que hacer un plano de asientos para una cena de gala.
هذه التقييدات تذكرني بتنظيم ‫المقاعد في حفلة عشاء
Dentro de nada tenemos nuestra fiesta de cumpleaños, así que echemos un vistazo al plano de los asientos.
ولدينا بالفعل حفلة عيد ميلاد قريبًا، ‫لذا فلننظر على تنظيم المقاعد لها
Invitamos a toda esta gente para cenar, pero no está claro dónde se sentarán.
لقد دعونا كل هؤلاء الأشخاص للعشاء لكن ‫هناك تقييدات بخصوص أين يريدون الجلوس
Algunos deben sentarse al lado de su mejor amigo,
بعض الأشخاص يجب أن يجلسوا ‫بجوار صديقهم المقرب
Otros tienen lo que llaman "amienemigos",
آخرون بينهم ما ‫نسميه علاقة متوترة
así que puede que no quieran estar al lado de ciertas personas.
لذا، ربما لن يريدوا ‫الجلوس بجوار أشخاص معينين
Con todo esto en cuenta, realicé este <i>layout</i>.
لذا، بوضع كل هذا في الاعتبار، ‫توصلت لهذا النموذج المقترح
Kunal, Ben y Kagure están arriba.
(كونال) و(بين) ‫و(كيجوري) بالأعلى هنا
Natalie, Lyla y yo estamos abajo y Amy, Omoju y Jenny en esta esquina.
(ناتالي) و(ليلى) وأنا بالأسفل هنا، ‫و(إيمي) و(أوموجو) و(جيني) في هذا الركن
¿Podemos hacer los arreglos del plano en XML usando vistas de texto y un RelativeLayout?
أيمكننا تكوين نظام المقاعد هذا في XML ‫باستخدام واجهات النص والمخطط النسبي؟
Sabemos cómo colocar las vistas en las esquinas,
نحن نعرف كيفية وضع ‫الواجهات في الأركان
La vista de texto de Lyla se alinearía con los bordes izquierdo e inferior del padre.
لذا، واجهة نص (ليلى) سيتم وضعها ‫بمحاذاة حافتي النموذج اليسرى والسفلى
La vista de texto de Jennie se alinearía con los bordes derecho e inferior.
واجهة نص (جيني) سيتم وضعها بمحاذاة ‫حافتي النموذج اليمنى والسفلى
A Ben lo alinearíamos con el borde superior del padre.
بالنسبة لـ(بين) سنضعه ‫بمحاذاة حافة النموذج العليا
Asumimos que el padre ocupa la anchura y la altura de la pantalla,
بالمناسبة، نحن نفترض أن المخطط ‫الأصل يملأ طول وعرض الشاشة بالكامل
así que fijamos <i>match_parent</i> para el <i>width</i> y el <i>height.</i>
لهذا ضبطنا قيم الأبعاد ‫إلى (مماثلة الأصل)
Volvamos a Ben. Está alineado con el borde superior.
فلنعود لـ(بين)، سيتم وضعه ‫بمحاذاة حافة النموذج العليا
Además, queremos centrarlo de forma horizontal.
نريد أيضًا أن يكون ‫في المنتصف أفقيًا
Anteriormente, podrías llamar a estas tres vistas "vista fija",
ويمكنك أن تدعو هذه الواجهات ‫الثلاثة بالواجهات الارتكازية
porque todos los demás se colocan en relación con estas personas.
لأن بقية الواجهات سيتم ‫تحديد موضعهم بالنسبة لهم
Estas personas no se moverán, sin importar donde esté sentado el resto.
وهم لن يتحركوا، ‫أينما يجلس الباقون
Añadamos a otra persona.
لذا فلنضف واحدًا آخر
Tenemos a Kunal aquí, a la izquierda de Ben.
لدينا (كونال) هنا، ‫والموضوع على يسار (بين)
¿Cómo expresamos esto en XML?
لكن كيف نعبر عن هذا في ‫كود (إكس إم إل)؟
No hay un atributo específico que diga que una vista debería estar a la izquierda de una vista llamada Ben.
لا توجد خاصية معينة تجعل واجهة ‫على يسار واجهة تسمى (بين)
Todos los nombres de los atributos Android son generales para que funcionen en cualquier situación.
كل أسماء خصائص الأندرويد عامة ‫لكي تستخدمهم أي استخدام تريده
Queremos colocar a Kunal a la izquierda de Ben,
نحن نريد وضع (كونال) على يسار (بين)
pero no conocemos ningún atributo que pueda hacer eso.
لكننا لا نعرف اسم أي ‫واجهة متوفرة تقوم بهذا
Por suerte, RelativeLayout tiene un atributo
لكن لحسن الحظ، ‫للمخطط النسبي خاصية..
llamado <i>android: layout_toLeftof.</i>
تُدعى android:layout_toleftof
Esto significa que la vista de texto de Kunal debería estar a la izquierda de otra vista.
وهذا يعني أن واجهة نص (كونال) ‫ستكون على يسار واجهة ما
La forma de especificar una vista es utilizando vistas ID.
ويمكننا تحديد واجهة معينة من ‫خلال استخدام معرفات الواجهات
Podemos asignar vistas ID a cualquier vista.
يمكننا تعيين اسم تعريف لأي واجهة
No tienen que dirigirse específicamente a un RelativeLayout.
ليس لزامًا أن يكونوا ‫داخل مخطط نسبي
Puden estar dentro de un RelativeLayout, o en un LinearLayout o en otra vista de grupo.
يمكن أن يكونوا في مخطط نسبي أو ‫خطي أو أي (مجموعة واجهات) أخرى
En la vista de texto de Ben podemos añadir este atributo: <i>android:id</i>.
لذا، في كود واجهة نص (بين)، يمكننا إضافة ‫هذه الخاصية android:id
Su valor es el nombre de la ID.
وقيمتها تكون اسم المعرف
El formato empieza por el símbolo @,
صيغته تبدأ برمز "@"..
que hace referencia a un recurso en nuestra aplicación Android.
وهو هنا يشير لمورد ‫في تطبيق الأندرويد
También vimos que este símbolo @ hacía referencia a las imágenes en nuestra aplicación.
وقد رأينا رمز "@" يُستخدم ‫للإشارة للصور في تطبيقنا
Por ejemplo, la aplicación Drawable.
مثل drawable@
A continuación especificamos el tipo de recurso.
ثم نحدد نوع المورد
En este caso, el tipo de recurso es una ID.
في هذه الحالة نوع المورد هو مُعرف
Añadimos el símbolo + porque es la primera vez que presentamos esta ID.
نضيف أيضًا علامة الجمع "+" لأن هذه ‫أول مرة نعلن فيها عن هذا المعرف
Luego tenemos una barra y por último el nombre de la vista.
ثم نكتب شرطة مائلة ثم اسم الواجهة
Este es el nombre que elegimos para la vista de texto de Ben.
هذا هو الاسم الذي اخترناه ‫لواجهة النص (بين)
La llamamos <i>be_text_view</i>.
سنسميه ben_text_view
Los requisitos son que el nombre no puede tener espacios.
المتطلبات الأساسية للاسم ‫هي أن يكون بدون مسافات
Por eso utilizamos guiones bajos aquí.
لهذا نستخدم هنا رمز الشرطة السفلية
Debe empezar por una letra y no puede contener ningún símbolo de puntuación extraño.
ويجب أن يبدأ بحرف وألا يحتوى ‫على أي رموز ترقيم غريبة
No obstante, podéis utilizar números.
لكن لا بأس من الأرقام
En este caso, Ben tiene la ID <i>ben_text_view.</i>
لذا، في هذه الحالة، نعطي (بين) ‫المعرف ben_text_view
De esta forma, podemos referirnos a él más tarde.
وهكذا يمكننا الإشارة له لاحقًا
En la vista de texto de Kunal podemos añadir el atributo <i>layout_toLeftof</i>
لذا، في كود واجهة نص (كونال) يمكننا ‫إضافية خاصية layout_toleftof
y podemos decir que se encuentra a la izquiera de la vista de texto de Ben.
ويمكننا تحديد أنها ستكون ‫على يسار ben_text_view
Nos referiremos al ID de la vista de texto de Ben usando @id.
نشير إلى مُعرف واجهة نص ‫(بين) من خلال كتابته بعد "id@"
No necesitamos usar + porque ya definimos esa ID.
لا نحتاج لكتابة علامة الجمع لأننا ‫عرّفنا بالفعل هذا المُعرف
Esta en la segunda vez que utilizamos la ID.
هذه ثاني مرة نستخدمه
Cuando tengáis los nombres de las ID, aseguraos de que son exclusivos.
عندما تختار مُعرفات للواجهات، تأكد أن ‫يكونوا جميعًا أسماءً فريدة غير مكررة
Normalmente escoger algo relacionado con el contenido es útil.
وفي العادة، من المفيد أن تستخدم ‫اسمًا مرتبطًا بمحتوى الواجهة
Perfecto. De esta forma colocáis a Kunal a la izquierda de Ben.
حسنًا، رائع، هكذا تضع ‫(كونال) على يسار (بين)
Ahora, por ejemplo, queremos colocar a Omoju encima de Jennie.
الآن، فلنفرض أننا نريد مثلًا ‫وضع (أوموجو) فوق (جيني)
Necesitaremos referirnos a Jennie,
بما أننا سنحتاج للإشارة لـ(جيني)
así que deberíamos crear una ID para Jennie.
علينا إنشاء مُعرف لـ(جيني)
En la vista de texto de Jennie, especificamos este atributo y le damos un valor.
لذا، في كود واجهة نص (جيني)، نضيف ‫هذه الخاصية ونعطيها هذه القيمة
El nombre ID de Jennie es<i> jennie_text_view .</i>
المعرف هو jennie_text_view
En la vista de texto de Omoju añadimos estre atributo.
وفي كود واجهة نص (أوموجو)، ‫نضيف هذه الخاصية
Especifica que Omoju debería estar encima de <i>jennie_text_view.</i>
معنى هذا أن (أوموجو) ستوضع ‫فوق واجهة النص (جيني)
Y esta es la ID que creamos.
وهذا هو المعرف الذي اخترناه
Echemos un vistazo al XML layout.
فلننظر لمخطط (إكس إم إل)
Tenemos un RelativeLayout donde el <i>width</i> y el <i>height</i> son match_parent.
لدينا مخطط نسبي طوله ‫وعرضه بقيمة (مماثلة الأصل)
Nos encontramos con la vista de texto de Lyla.
ثم لدينا واجهة نص (ليلى)
Está alineada con la esquina inferior izquierda del padre
وهي موضوعة بمحاذاة حافتي ‫المخطط السفلى واليسرى
y eso es lo que vemos aquí.
وهذا هو ما نراه بالأسفل هنا
Aparece la vista de texto de Jennie,
ثم لدينا واجهة نص (جيني)
alineada con la esquina inferior derecha.
وهي موضوعة بمحاذاة حافتي ‫المخطط السفلى واليمنى
La vemos aquí.
لذا فهي هنا
Luego tenemos la vista de texto de Ben,
ثم لدينا واجهة نص (بين)
alineada con el borde superior del padre.
وهي موضوعة بمحاذاة ‫حافة المخطط العليا
También está centrada horizontalmente.
وهي أيضًا في المنتصف أفقيًا
Estas son las vistas fijas. Ahora podemos colocar otras vistas alrededor.
هؤلاء الثلاثة واجهات الارتكازية ويمكننا ‫الآن ضبط موضع بقية الواجهات حولهم
Fijaos que por cada una de las vistas me adelanté y añadí una ID.
لاحظ أنني قمت بالفعل ‫بإضافة معرف لكل واجهة
Esta es la ID de la vista de texto de Ben.
لذا هذا هو معرف واجهة نص (بين)
Ahora podemos colocar la vista de texto de Kunal a la izquierda de Ben.
ثم يمكننا وضع واجهة نص ‫(كونال) على يسار (بين)
Alineo a Kunal con el borde superior y a la izquierda de la vista de texto de Ben.
أضبط (كونال) ليكون بمحاذاة حافة ‫المخطط العليا وعلى يسار (بين)
Utilizo la vista de la ID para Ben aquí.
وأستخدم مُعرف (بين) هنا
Luego colocamos la vista de texto de Omoju encima de Jennie.
ثم نضع واجهة نص ‫(أوموجو) فوق (جيني)
Omoju está alineado con el borde derecho y está encima de la vista de texto de Jennie.
(أوموجو) موضوع بمحاذاة حافة ‫المخطط اليمنى وفوق واجهة (جيني)
Estupendo. Hay que colocar más amigos correctamente en este <i>layout.</i>
حسنًا، رائع، هناك أصدقاء آخرين ‫علينا ضبط مواضعهم في هذا المخطط
En los apuntes del profesor os damos un enlace al visualizador XML con un código inicial ya establecido.
في خانة (ملاحظات المدرب) بالأسفل تركنا ‫لك رابطًا لمحاكي (إكس إم إل) ابتدائي
Sigue adelante y modifica el XML para que consigamos el <i>layout </i>que todos desean.
قم بتعديله لكي نحصل على هذا ‫المخطط المطلوب لكل الواجهات
Algunas de las vistas no están colocadas correctamente, así que tendréis que arreglarlas.
مواضع بعض الواجهات غير ‫صحيحة لذا عليك إصلاح هذا
Por cierto, acabamos de incluir más atributos nuevos.
بالمناسبة، لقد قدمنا لك للتو ‫الكثير من الخصائص الجديدة
No os sintáis obligados a memorizarlos todos.
لكن لا تشعر بالحاجة ‫لتذكرهم جميعًا
Podéis consultarlos siempre que queráis.
يمكنك دائمًا البحث ‫عن أي منهم في أي وقت
Podéis buscar RelativeLayout, LayoutParams,
يمكنك البحث عن: ‫relativelayout layout params
Si pincháis en el primer enlace, iréis a la documentación.
إذا نقرت أول نتيجة بحث، ‫ستجد التوثيق الخاص به
Estos son todos los atributos XML que podéis poner en una vista de hijo dentro de un RelativeLayout.
وهذه كل خصائص (إكس إم إل) التي يمكنك ‫إضافتها واجهة تابعة داخل مخطط نسبي..
De esta forma, el RelativeLayout sabe cómo ordenarlo.
لكي يستطيع المخطط تنسيقها
Aquí hay algunos que ya conocéis.
هذه بعض الخصائص المألوفة لك
<i>Layout_above</i>, <i>alignParentbottom</i>,<i> NalignParentright, </i>etc.
layout_above, layout_alignParentBottom ‫alignParentRight، إلى آخره
Observad que para fines pedagógicos, el visualizador XML puede que no sea compatible
لاحظ أن لأغراض تعليمية، قد لا يدعم ‫محاكي (إكس إم إل) كل هذه الخصائص
con todos estos atributos. No obstante, cuando programéis una aplicación en Android Studio, deberíais poder usarlos todos.
لكن عندما تطور تطبيقاً على (آندرويد ‫استديو) ستستطيع استخدامهم جميعًا
Similar videos:

Relative Layout
Udacity
49.2K views 356 likes 11 dislikes 06 Jun 201638% match


LinearLayout
Udacity
206K views 104 likes 0 dislikes 26 May 201536% match


XML Syntax
Udacity
337.3K views 279 likes 14 dislikes 26 May 201534% match


Width and Height
Udacity
120.6K views 97 likes 1 dislikes 27 May 201531% match


Recover files from hard disk or pendrive without format, safely
AirXander
173.7K views 2.6K likes 116 dislikes 14 Oct 201830% match





Circuit Simulation in LTSpice Tutorial part 1/3
Afrotechmods
468.5K views 2.5K likes 50 dislikes 28 Dec 201030% match

Simple ImageView
Udacity
150K views 82 likes 1 dislikes 26 May 201530% match


What is a Java Class?
Udacity
8.4K views 68 likes 2 dislikes 07 Jul 201530% match


Padding vs. Margin
Udacity
114.7K views 75 likes 3 dislikes 21 Jul 201530% match


A Quick Tour of Android Studio
Udacity
18.1K views 71 likes 3 dislikes 06 Jun 201630% match


String Data Type
Udacity
78.9K views 30 likes 0 dislikes 28 May 201530% match


Inheriting Behavior
Udacity
62.9K views 31 likes 2 dislikes 29 Jul 201530% match


TODO Android App Engineer @ Google 1
Udacity
32.7K views 315 likes 7 dislikes 06 Jun 201630% match


Debugging a Crash
Udacity
81.8K views 43 likes 1 dislikes 23 May 201529% match


Best Equipment for ATTILA+TAKEDA? Let's Test | Rise of Kingdoms
Wick Gaming
11.2K views 517 likes 6 dislikes 20 Mar 202129% match


How to create, trace and shape false joints in a tile to make an optical illusion?
Karo tuto the french tiler🇫🇷
11.7K views 692 likes 10 dislikes 25 Apr 202029% match









Create the String Variable
Udacity
71.9K views 28 likes 0 dislikes 27 May 201529% match


Add or Remove Parameters
Udacity
63.6K views 27 likes 0 dislikes 14 Jul 201529% match


DIY LÁMPARA SUPER MARIO BROS | DECORACIÓN GAMER | MANUALIDADES RECICLAJE | Te Digo Cómo
Te Digo Cómo
542.2K views 19K likes 403 dislikes 28 Nov 201729% match


Cómo pasar cintas de vídeo VHS al PC - Digitalizar y convertir vídeos VHS a la computadora
AirXander
16K views 435 likes 12 dislikes 17 Nov 202029% match





WAGO L-BOXX 102 SORTIMO 887-913 zestaw złączek dla elektryka - WALIZKA | ForumWiedzy
ForumWiedzy
7.8K views 144 likes 4 dislikes 06 Mar 202029% match






TODO Android App Engineer @ Google 2
Udacity
17.8K views 171 likes 6 dislikes 06 Jun 201629% match


Documentation
Udacity
203.9K views 114 likes 0 dislikes 27 Jul 201529% match


Increase Your Minecraft FPS for Free
ThioJoe
538.2K views 9.6K likes 2.1K dislikes 01 Jan 201629% match

EL MAGO YIF y el TRUCO PAN BAGUETTE REVELADO - ¿DEMONIOS o TECNOLOGÍA DIGITAL? Shin Lim
Fake Buster
628.9K views 13.8K likes -1 dislikes 25 Jul 201829% match



R16 B35 How to make a small flower bouquet 如何自製小型心意花束
Gordon Lee
119.1K views 818 likes 56 dislikes 25 Oct 201628% match


CAPPY - SUPER MARIO ODYSSEY
Te Digo Cómo
197.1K views 6K likes 181 dislikes 18 Feb 201828% match


Build Layout
Udacity
147.7K views 27 likes 0 dislikes 29 May 201528% match


#13 Como hacer levitar un billete -- Magia Accesible Truco Revelado
Ayudas Para Todos
2.3M views 0 likes 0 dislikes 15 Aug 201328% match










Conditioning My Young Racing Pigeons
Maney Pigeons
35.8K views 710 likes 25 dislikes 20 Sep 202028% match


Settings Privacy About Contact Donate