Okay, so we've seen TextView code for the first time.
>> But it's kind of hanging out in limbo.
>> Right, we do need a space where we can house it.
>> Yeah, that space is an IDE.
>> There's that acronym again.
What does it stand for again, Catherine?
>> Integrated Development Environment >> Right, and
we are going to be using Android Studio in this class.
This is what it looks like.
Still a little intimidating.
>> Yeah. I think we might need something
that will help our learner ramp up a little bit easier.
>> Right, so we've been working on developing something that is
Android Studio on training wheels, in the tradition of really convoluted
acronyms in computer science, we are calling it XMLV.
>> Which stands for XML Visualizer.
>> So you write a little bit of XML?
You get to see the output.
You write some more, you get to see more output.
>> Yeah.
So let's go use it.
>> Okay.
>> Since this XML visualizer was created specifically for this course,
it won't provide all the functionality that Android Studio supports.
But eventually in the problem set of this lesson,
we'll get you into Android Studio so you won't need this website anymore.
A link is in the instructor notes If you want to follow along.
For this code, the text says Happy Birthday.
So when I look at the device it says, Happy Birthday.
Now let's try to change the text to Happy Birthday, Kunal.
And then when I zoom in on the device preview you see that it now says,
Happy Birthday, Kunal.
And what happens by trying to stand the width and the height.
I'll pick some arbitrary values like the 300dp for
the width and 500 for the height.
And now in the preview pane, you see that the TextView is a lot bigger.
The text though, however, is still the same size in the top left corner.
Notice that for the width and height values of 300 and
500 is followed by dp in each case.
This is a unit of measure like centimeters or
millimeters, that we use to describe the size of views on Android.
As well as the distancing between views.
The unit dp stands for density-independent pixels.
Let me explain why we need that.
Say these beautifully drawn rectangles represent different devices.
They're the same physical size, but they differ in terms of resolution.
This is a medium resolution device with a medium number of pixels on the screen,
high resolution and extra-high resolution device.
When I say pixel, I mean a phone screen is made up of many tiny squares,
which are pixels, and they light up based on what you're looking at.
So if I define the size of a view, for example, a button, to be 2 pixels tall
by 2 pixels wide, this is what it would look like on a medium resolution device.
On a high resolution device, it would also be 2 pixels by 2 pixels.
But it's a little bit smaller,
because there's a lot more pixels trying to be packed into this device, and
then on an extra high resolution device where there's tons more pixels packed
into this space, this button is actually pretty tiny.
I can barely tap on it with my finger.
I have to use edge of my finger or my fingernail to reach it.
Just because I have extra high resolution device,
doesn't mean I have a smaller finger.
I still want to be able to tap the buttons on the screen.
And that is why we have density-independent pixels.
I can define my button to be 2dps tall by 2dps wide.
This is what it would look like across the different devices.
It is the same physical size, but
under the hood Android is mapping it to a different number of pixels.
You don't have to worry about any of that logic, all you need to remember
is that you need to define your sizes in terms of dp values.
When designing your apps, we recommend that all touch targets like buttons
should be at least 48dps tall and wide.
Notice that it says 48dps and not 48 pixels,
otherwise it would be really tiny on this extra high resolution device.
This will make your app easy to use for everyone.
So with all of this knowledge, I want you to try and
change the TextView code now.
You're going to be writing your very first lines of XML, how exciting.
So first try to change the text in the TextView.
And then try to change the sides of the TextView.
Then I want you to try to create an error sad face.
And then I want you to undo it, happy face.
حسناً، رأينا النص البرمجي الخاص بمعاينة النص لأول مرة.
لكن، يبدو معلقاً نوعاً ما.
أجل، نريد مساحةً لنضعه بها.
هذه المساحة تدعى IDE.
عدنا للاختصارات مرةً أخرى.
إلى ماذا يرمز ذلك، كاثرين؟
- بيئة تطوير متكاملة. - أجل،
وسنستخدم أندرويد استوديو في هذه الدروس.
هكذا يبدو شكله.
مازلت خائفاً قليلاً.
أجل، اعتقد أننا بحاجة شيءٍ ما
ليساعد طلابنا على البداية بشكل أسهل.
نعم، كنا قد عملنا على تطوير
شيءٍ كتدريب على الأندرويد استوديو، وكعادة اختصارات الحاسب المعقدة،
أطلقنا عليه XMLV
وهو اختصار لـXML Visualizer.
فتكتب قليلاً بلغة XML؟
ويمكنك رؤية الخرج.
وتكتب المزيد، فترى المزيد من الخرج.
أجل
لنبدأ باستخدامه.
حسناً.
بما أن XML visualizer قد صُمّم خصيصاً لهذه الدورة،
لن يضم كامل الخصائص التي يدعمها أندرويد استوديو.
ولكننا في نهاية هذا الدرس،
سننتقل إلى أندرويد استوديو ولن نحتاج هذا الموقع بعد الآن.
يوجد الرابط في ملاحظات المعلم أن أردته.
من أجل هذا النص الرمجي، النص هو "عيد ميلاد سعيد".
فعندما أنظر إلى الجهاز سأرى عبارة "عيد ميلاد سعيد"
الآن، لنغير النص إلى "عيد ميلاد سعيد، كونول"
وسأقرّب على معاينة الجهاز يمكنك أن ترى ماهو مكتوب
"عيد ميلاد سعيد، كونول".
وما سيحصل عندما أحاول ضبط العرض والارتفاع.
سأختار قيماً عشوائية ٣٠٠ دي بي مثلاً للعرض،
و ٥٠٠ من أجل الارتفاع.
والآن ترى في تبويب المعاينة أن معاينة النص أصبحت أكبر بكثير.
ولكن مايزال النص بنفس الحجم في الزاوية العليا اليسرى.
لاحظ أن قيمتا العرض والارتفاع
٣٠٠ و ٥٠٠ قد أضيفت لهما دي بي.
هذه وحدة قياس كالسنتيمتر أو المليمتر،
ونستخدمها لوصف حجم المعاينات في أندرويد.
وكذلك البُعد بين المعاينات.
وترمز إلى بكسل الكثافة المستقل.
دعني أشرح لك لما نحتاج هذا.
لنفترض أن هذه المستطيلات تمثّل أجهزة مختلفة.
جميعها لها ذات الحجم الفيزيائي، لكنها تخلف بما يتعلق بالدقّة.
هذا هاتف متوسط الدقة بعدد بكسلات متوسط على الشاشة،
جهاز بدقة عالية، وجهاز بدقة عالية شديدة.
وعندما أقول بكسل،أعني أن شاشة الهاتف تحتوي على مربعات صغيرة،
والتي هي بكسلات، وتضيء بحسب ماتنظر إليه.
فإذا ماضبطت حجم معاينةٍ ما، زر مثلاً، ليكون ٢ بكسل طولاً
و٢ بكسل عرضاً، هذا ماسيبدو عليه في جهاز متوسط الدقة.
في جهاز عالي الدقة، ستكون أبعاده ٢*٢ بكسل أيضاً.
ولكنه أصغر قليلاً،
لأن هناك المزيد من البكسلات تحاول أن تتسع في هذا الجهاز،
في الجهاز ذو الدقة العالية، توجد الكثير من البكسلات مكدسة
في هذه المساحة، لهذها يظهر الزر صغيراً.
بالكاد أستطيع الضغط عليه بإصبعي.
يجب أن أستخدم طرف إصبعي أو الظفر لأصل إليه.
ولكنني إذا ماكنت أملك جهازاً دو دقة عالية،
هذا لا يعني امتلاكي لإصبع أصغر.
مازلت أريد أن أنقر على الزر في الشاشة.
ولهذا لدينا بكسل الكثافة المستقل.
سأقوم بضبط الزر ليكون ٢ دي بي عرضاً، و ٢ دي بي طولاً.
وهذا ماسيبدو عليه الزر في الأجهزة المختلفة.
نفس الحجم الفيزيائي،
ولكن أندرويد يشرف على تحويله لعدد بكسلات مختلفة.
لا تشغل بالك بفهم هذا المنطق، كل مايلزمك تذكره
هو أنه يجب أن تضبط قيمك باستخدام دي بي.
وعند تصميم تطبيقك، ننصحك بأن تجعل كل الأهداف التي ستُلمس
كالأزرار، أن تكون على الأقل ٤٨ دي بي طولاً وعرضاً.
لاحظ أننا قلنا ٤٨ دي بي وليس ٤٨ بكسل.
وإلا فستظهر ضئيلة جداً على الأجهزة عالية الدقة جداً.
وهذا يجعل جهازك سهل الاستخدام للجميع.
وبهذه المعلومات، أريد منك الآن أن تحاول
وتغير من النص البرمجي لمعاينة النص.
ستقوم بكتابة أسطرك الأولى بلغة XML. كم هذا رائع.
حاول أولاً أن تغير النص بداخل معاينة النص.
ثم حاول تغيير حجم معاينة النص.
ثم أريد منك إنشاء خطأ. بوجه حزين.
ثم التراجع عنه. بوجه سعيد.
Okay, so we've seen TextView code for the first time.
>> But it's kind of hanging out in limbo.
>> Right, we do need a space where we can house it.
>> Yeah, that space is an IDE.
>> There's that acronym again.
What does it stand for again, Catherine?
>> Integrated Development Environment >> Right, and
we are going to be using Android Studio in this class.
This is what it looks like.
Still a little intimidating.
>> Yeah. I think we might need something
that will help our learner ramp up a little bit easier.
>> Right, so we've been working on developing something that is
Android Studio on training wheels, in the tradition of really convoluted
acronyms in computer science, we are calling it XMLV.
>> Which stands for XML Visualizer.
>> So you write a little bit of XML?
You get to see the output.
You write some more, you get to see more output.
>> Yeah.
So let's go use it.
>> Okay.
>> Since this XML visualizer was created specifically for this course,
it won't provide all the functionality that Android Studio supports.
But eventually in the problem set of this lesson,
we'll get you into Android Studio so you won't need this website anymore.
A link is in the instructor notes If you want to follow along.
For this code, the text says Happy Birthday.
So when I look at the device it says, Happy Birthday.
Now let's try to change the text to Happy Birthday, Kunal.
And then when I zoom in on the device preview you see that it now says,
Happy Birthday, Kunal.
And what happens by trying to stand the width and the height.
I'll pick some arbitrary values like the 300dp for
the width and 500 for the height.
And now in the preview pane, you see that the TextView is a lot bigger.
The text though, however, is still the same size in the top left corner.
Notice that for the width and height values of 300 and
500 is followed by dp in each case.
This is a unit of measure like centimeters or
millimeters, that we use to describe the size of views on Android.
As well as the distancing between views.
The unit dp stands for density-independent pixels.
Let me explain why we need that.
Say these beautifully drawn rectangles represent different devices.
They're the same physical size, but they differ in terms of resolution.
This is a medium resolution device with a medium number of pixels on the screen,
high resolution and extra-high resolution device.
When I say pixel, I mean a phone screen is made up of many tiny squares,
which are pixels, and they light up based on what you're looking at.
So if I define the size of a view, for example, a button, to be 2 pixels tall
by 2 pixels wide, this is what it would look like on a medium resolution device.
On a high resolution device, it would also be 2 pixels by 2 pixels.
But it's a little bit smaller,
because there's a lot more pixels trying to be packed into this device, and
then on an extra high resolution device where there's tons more pixels packed
into this space, this button is actually pretty tiny.
I can barely tap on it with my finger.
I have to use edge of my finger or my fingernail to reach it.
Just because I have extra high resolution device,
doesn't mean I have a smaller finger.
I still want to be able to tap the buttons on the screen.
And that is why we have density-independent pixels.
I can define my button to be 2dps tall by 2dps wide.
This is what it would look like across the different devices.
It is the same physical size, but
under the hood Android is mapping it to a different number of pixels.
You don't have to worry about any of that logic, all you need to remember
is that you need to define your sizes in terms of dp values.
When designing your apps, we recommend that all touch targets like buttons
should be at least 48dps tall and wide.
Notice that it says 48dps and not 48 pixels,
otherwise it would be really tiny on this extra high resolution device.
This will make your app easy to use for everyone.
So with all of this knowledge, I want you to try and
change the TextView code now.
You're going to be writing your very first lines of XML, how exciting.
So first try to change the text in the TextView.
And then try to change the sides of the TextView.
Then I want you to try to create an error sad face.
And then I want you to undo it, happy face.
Bien, hemos visto el código TextView por primera vez.
Pero es como estar en el limbo.
Correcto, necesitamos un espacio donde alojarlo.
Sí, y ese espacio es un IDE.
- Otra vez ese acrónimo. - Sí.
¿Qué significa, Catherine?
- Entorno de Desarrollo Integrado. - Correcto.
Y en esta clase usaremos Android Studio.
Así es como se ve.
Todavía un poco intimidante.
Sí, creo que podríamos necesitar algo
que ayude a facilitar un poco el aprendizaje del alumno.
Así que hemos trabajado en el desarrollo de algo
que es Android Studio sobre ruedas de entrenamiento,
que en la tradición de siglas muy complejas
en ciencias de computación, lo llamamos XMLV.
Lo que significa Visualizador XML.
Entonces escribes un poco de XML y puedes ver la salida.
Escribes un poco más, y puedes ver más salida.
Sí, entonces usémoslo.
Bueno.
Puesto que este visualizador de XML
fue creado específicamente para este curso,
no proporcionará toda la funcionalidad
que Android Studio soporta.
Pero en definitiva con el conjunto de problemas de esta lección,
te introduciremos en Android Studio
y ya no necesitarás este sitio web.
Hay un enlace en las notas del instructor
si quieres seguir adelante.
En este código, el texto dice "Happy Birthday!".
Así que cuando me fijo en el dispositivo dice Happy Birthday!.
Ahora cambiemos el texto a "Happy Birthday, Kunal!".
Cuando observamos la vista previa del dispositivo
vemos que ahora dice, Happy Birthday, Kunal!.
Y qué sucede si establecemos la anchura y la altura.
Tomaré algunos valores arbitrarios
como 300 dp para la anchura y 500 para la altura.
Ahora en el panel de vista previa,
ves que el TextView es mucho más grande.
El texto, sin embargo, sigue siendo del mismo tamaño
en la esquina superior izquierda.
Observa que los valores de anchura y de altura
de 300 y 500 son seguidos por dp en cada caso.
Esta es una unidad de medida,
como los centímetros y los milímetros,
que utilizamos para describir el tamaño de las vistas en Android,
así como el distanciamiento entre las vistas.
La unidad dp significa píxeles independientes de la densidad.
Déjame explicar por qué necesitamos eso.
Digamos que estos rectángulos que están bellamente dibujados
representan diferentes dispositivos.
Son del mismo tamaño físico,
pero difieren en cuanto a la resolución.
Este es un dispositivo de resolución media
con un número medio de píxeles en la pantalla,
un dispositivo de resolución alta y uno de resolución extra-alta.
Cuando digo píxel, me refiero a que una pantalla de teléfono
se compone de muchos cuadraditos, que son los píxeles,
y se encienden según lo que estés viendo.
Si defino que el tamaño de una vista, por ejemplo un botón,
sea de 2 píxeles de alto por 2 píxeles de ancho,
se vería así en un dispositivo de resolución media.
En un dispositivo de resolución alta,
también sería de 2 píxeles por 2 píxeles.
Pero es un poco más pequeño,
porque hay muchos más píxeles
que están comprimidos en este dispositivo,
y en un dispositivo de extra alta resolución
donde hay muchos más píxeles
que están comprimidos en este espacio,
este botón es realmente muy pequeño.
Apenas puedo tocarlo con mi dedo.
Tengo que usar el borde de mi dedo o mi uña para llegar a él.
El hecho de tener un dispositivo de extra alta resolución
no significa que tenga un dedo más pequeño.
Aún así, quisiera poder tocar los botones en la pantalla.
Y es por eso que tenemos píxeles independientes de la densidad.
Puedo definir que mi botón sea de 2 dp de alto por 2 dp de ancho.
Así se vería en los diferentes dispositivos.
Es el mismo tamaño físico,
pero por debajo, Android asigna una cantidad distinta de píxeles.
No tienes que preocuparte por nada de esa lógica.
Todo lo que necesitas recordar
es que tienes que definir los tamaños en términos de valores dp.
Al diseñar tus aplicaciones, te recomendamos
que todos los objetivos táctiles como los botones
tengan al menos 48 dp de alto y de ancho.
Nota que dice 48 dp y no 48 píxeles,
de lo contrario se vería muy pequeño
en este dispositivo de extra alta resolución.
Esto hará que tu aplicación sea fácil de usar para todos.
Con todo este conocimiento,
quiero que intentes cambiar el código TextView ahora.
Vas a escribir tus primeras líneas de XML, ¡qué emocionante!.
Primero trata de cambiar el texto en el TextView.
Y luego trata de cambiar el tamaño del TextView.
Luego quiero que trates de crear un error, cara triste.
Y luego quiero que lo deshagas, cara feliz.
On a vu le code TextView pour la première fois.
Mais c'est comme traîner dans les limbes.
On a besoin d'un espace où nous pouvons nous abriter.
Oui, cet espace est un IDE.
C'est à nouveau cet acronyme.
C'est quoi ça, Catherine ?
Integrated Development Environment ok et
Nous allons utiliser Android studio dans cette classe.
Ceci est à quoi il ressemble.
C'est encore un peu intimidant.
Je pense que nous pourrions avoir besoin de quelque chose
qui aidera nos apprenant à ramper plus facilement.
On va travailler sur le développement quelque chose qui fait parti
de la base d'Android Studio, et qui est un nouveau
acronymes en informatique, on appelle cela XMLV.
Qui signifie XML Visualizer.
Vous écrivez donc un peu de XML ?
Vous allez voir la sortie.
Vous écrivez plus de code, vous aurez plus en sortie.
Ok.
Allons donc l'utiliser.
Ok.
Depuis ce visualiseur XML a été créé spécifiquement pour ce cours,
il ne fournira pas toutes les fonctions qu'Android Studio prend en charge.
Mais dans le problème de cette leçon,
On utilisera Android studio et vous n'aurez plus besoin de ce site.
Un lien est dans les notes de l'instructeur Si vous voulez suivre.
Pour ce code, le texte dit Joyeux anniversaire.
Quand je regarde l'appareil, il dit, Joyeux anniversaire.
Essayons de changer le texte Happy Birthday, Kunal.
Je zoome sur le dispositif prévisualisé vous voyez qu'il dit maintenant,
Happy Birthday, Kunal.
Et ce qui se passe en essayant de tenir la largeur et la hauteur.
Je vais reprendre certaines valeurs arbitraires comme le 300dp pour
la largeur et 500 pour la hauteur.
Dans le volet d'aperçu, vous voyez que le TextView est beaucoup plus grand.
Le texte est encore de même taille dans le coin supérieur gauche.
Notez que pour la largeur et la hauteur elles ont des valeurs de 300 et
500 suivie par DP dans chaque cas.
Ceci est une unité de mesure comme centimètres ou
Millimètres, que nous utilisons pour décrire la taille de vues sur Android.
En plus de l'éloignement entre les vues.
Le DP de l'unité signifie pixels indépendants de la densité.
Permettez-moi de vous expliquer pourquoi nous avons besoin de cela.
Ces rectangles magnifiquement dessinés représentent différents dispositifs.
Ils sont de la même taille physique, mais ils diffèrent en termes de résolution.
C'est un dispositif de résolution moyen avec un nombre moyen de pixels,
haute résolution et dispositif extra-haute résolution.
Je veux dire un écran de téléphone est constitué de nombreux petits carrés,
qui sont des pixels, et ils allument basés sur ce que vous cherchez.
Je définis la taille d'un point de vue, un bouton, à être de 2 pixels de haut
par 2 pixels de large, ça va ressembler à ça sur un dispositif de résolution moyen.
Sur un périphérique haute résolution, il serait également 2 pixels par 2 pixels.
Mais il est un peu plus petit,
Car il y a plus de pixels embarqués dans ce dispositif, et
puis sur un dispositif de haute résolution où il y a des tonnes de pixels
dans cet espace, ce bouton est en fait assez petite.
Je peux à peine appuyer dessus avec mon doigt.
Je dois utiliser mon ongle pour l'atteindre.
Parce que j'ai un dispositif de haute résolution,
ne signifie pas que je dois avoir un petit doigt.
Je veux toujours être en mesure de cliquer les boutons sur l'écran.
Et voilà pourquoi nous avons des pixels indépendants de la densité.
Je peux définir mon bouton à être 2dps haut par 2dps larges.
Ceci est ce à quoi ça ressemblerait à travers les différents dispositifs.
C'est de la même taille physique, mais
Android mappe une manière différent les pixels.
Vous ne devez pas vous soucier de ça tout ce que vous devez vous rappeler
Est que vous devez définir vos tailles en termes de DP.
On vous recommande que toutes les cibles tactiles comme des boutons
soient au moins de 48dps haut et de large.
Notez qu'il est dit 48dps et pas 48 pixels,
Sinon ça serait vraiment minuscule sur ce dispositif à haute résolution.
Cela rendra votre application facile à utiliser pour tout le monde.
Donc, avec tout ce savoir, Je veux que vous essayiez et
changiez le code de TextView maintenant.
L'écriture de vos premières lignes de XML, est passionnant.
Donc d'abord essayez de changer le texte dans la TextView.
Et puis essayez de changer les côtés de la TextView.
Puis essayez de créer une erreur :(
Et puis je veux que vous l'annuliez, :)
Baik, kita sudah lihat kode TextView pertama kalinya.
Tapi sepertinya masih belum jelas.
Benar, kita butuh ruang sebagai tempatnya.
Ya, ruang itu bernama IDE.
- Nah, ada singkatan lagi. - Ya.
- Apa kepanjangannya, Catherine? - Integrated Development Environment
Benar. Kita akan gunakan Android Studio di kelas ini.
Seperti inilah kelihatannya.
Masih sedikit mengintimidasi.
Ya. Sepertinya kita butuh sesuatu
yang akan membantu siswa memahami dengan lebih mudah.
Benar, jadi kami telah membuat sesuatu yaitu Android Studio untuk pelatihan,
dalam tradisi singkatan berbelit pada ilmu komputer.
Kami menyebutnya XMLV.
Kepanjangannya XML Visualizer.
Jadi, Anda menulis sedikit XML? Anda harus melihat keluarannya.
Anda menulis lagi, Anda mendapat keluaran lagi.
Ya. Jadi mari kita gunakan.
Baik.
Karena XML Visualizer dibuat khusus untuk kursus ini,
tidak semua fungsi Android Studionya ada.
Tapi akhirnya, masalah yang dibuat untuk pelajaran ini,
Anda akan gunakan Android Studio sehingga Anda tidak butuh situs ini lagi.
Tautan ada di catatan instruktur jika Anda ingin mengikutinya.
Untuk kode ini, teksnya tertulis Happy Birthday.
Jadi ketika saya lihat pada perangkat, tulisannya Happy Birthday.
Nah, mari coba ubah teksnya menjadi Happy Birthday, Kunal.
Jika saya besarkan tampilannya, Anda bisa lihat sekarang tulisannya,
Happy Birthday, Kunal.
Dan apa yang terjadi jika kita ubah lebar dan tingginya.
Saya coba pakai nilai asal saja seperti...
...300dp untuk lebarnya dan 500dp untuk tingginya.
Dan sekarang di panel tampilan, Anda lihat TextView lebih besar.
Tapi ukuran teksnya masih sama di pojok kiri atas.
Perhatikan untuk nilai lebar dan tingginya 300 dan 500
diikuti dengan dp di setiap angkanya.
Ini adalah satuan unit seperti centimeter atau milimeter,
yang digunakan untuk menggambarkan ukuran tampilan di Android
dan juga jarak antar tampilan.
Satuan dp kepanjangan dari
density-independent pixels (piksel bebas kepadatan).
Mari saya jelaskan mengapa kita membutuhkannya.
Katakanlah kotak yang indah ini mewakili perangkat yang berbeda.
Ukuran fisiknya sama, tapi resolusinya beda.
Ini adalah perangkat resolusi menengah dengan piksel ukuran sedang pada layar,
perangkat resolusi tinggi, dan ekstra tinggi.
Ketika saya bilang piksel, maksud saya layar terdiri dari banyak kotak kecil,
yaitu piksel, dan mereka menyala tergantung dari apa yang Anda lihat.
Jadi jika saya menentukan ukuran tampilan,
contohnya, tombol, tinggi 2 piksel kali lebar 2 piksel,
seperti inilah kelihatannya pada perangkat resolusi menengah.
Pada perangkat resolusi tinggi, juga 2 x 2 piksel.
Tapi sedikit lebih kecil,
karena ada lebih banyak piksel yang harus masuk ke perangkat ini.
Lalu pada perangkat resolusi ekstra tinggi di mana ada sangat banyak piksel
yang termuat di ruang ini, tombol ini sebenarnya cukup kecil.
Sangat sulit ditekan dengan jari saya.
Saya harus menggunakan ujung jari atau kuku untuk menekannya.
Hanya karena saya punya perangkat resolusi ekstra tinggi,
tak berarti jari saya lebih mungil.
Saya ingin tetap bisa menekan tombol di layar.
Dan itulah sebabnya kita memakai piksel bebas kepadatan.
Saya bisa tentukan tombol dengan tinggi 2dps kali lebar 2dps.
Seperti inilah kelihatannya pada perangkat yang berbeda.
Ukuran fisiknya sama.
Tapi di balik itu, Android mengubahnya menjadi ukuran piksel yang berbeda.
Anda tak perlu memikirkan logikanya,
yang Anda harus ingat hanyalah menentukan ukurannya dalam nilai dp.
Saat mendesain aplikasi, kami sarankan semua target tekan yang seperti tombol
harus sedikitnya setinggi dan selebar 48dps.
Perhatikan bahwa itu 48dps dan bukan 48 piksel.
Jika tidak, nanti akan jadi amat kecil di perangkat resolusi ekstra tinggi.
Ini akan membuat aplikasi Anda mudah digunakan semua orang.
Dengan semua pengetahuan ini,
saya mau Anda coba dan ubah kode TextView sekarang.
Anda akan menulis baris pertama XML Anda. Asyik sekali.
Pertama, coba ubah teks pada TextView.
Dan coba ubah ukuran TextView.
Lalu coba buat eror dengan muka sedih.
Lalu kembalikan lagi, muka senang.
テキストビューのコードを初めて見ましたね
でも宙ぶらりんね
確かに収納するスペースが要るね
ええ そのスペースが IDE よ
またその頭辞語だね
何の略だっけ？
Integrated Development Environment （統合開発環境）
このクラスでAndroid Studio を使います
こんな風に見えます
まだ少しビクビクするよ
学習者がもう少し簡単に 取り組めるようなものが要るかもね
それで練習用Android Studio の開発に 取り組んだんだけど
コンピュータサイエンスの複雑な頭辞語の 伝統で XMLV と呼んでいるものです
XML Visualizer のことです
じゃ 少し XML を書く？
出力を見れる
もう少し書くと もう少し出力する
早速使いましょう
この XML visualizer は特にこのコース用に 作られたので
Android Studio が対応する機能の 全部はありませんが
いずれは このレッスンで設定される問題で
Android Studio に入るので もうこのサイトは要らなくなります
進みたければ 講師注記にリンクがあります
このコードでは テキストは「誕生日おめでとう」です
それでデバイスを見ると 「誕生日おめでとう」と出ています
そのテキストを 「誕生日おめでとう クナル」と変えてみます
次にデバイスのプレビューを拡大すると
今度は「誕生日おめでとう クナル」と 出ています
幅と高さを変えるとどうなるでしょう？
任意の値を選んで 幅を 300dp 高さを500 dp にしてみます
今度はプレビュー枠で テキストビューがうんと大きく見えます
ところがテキストはやはり同じ大きさで 左上端にあります
各ケースで300と500という 幅と高さの値の後に
dpがついていますね
これはセンチメートルとか ミリメートルのような測定単位で
Android でビューのサイズを説明する為に 使います
ビュー間の距離についても同様です
単位 dp は density-independent pixels （密度非依存ピクセル）を表します
なせそれが必要か説明しましょう
これらのきれいな描画の四角形が 異なるデバイスを表すとします
物理的サイズは同じですが 解像度の点で異なります
これは画面上中位のピクセル数の 中解像度デバイスでー
高解像度デバイス 超高解像度デバイスです
ピクセルとは 携帯画面を構成する 沢山の小さな四角形のことで
それらは 見ているものに基づいて 明るくなります
だから例えばビューのサイズを 縦横２ピクセルに定めると
中解像度デバイスではこう見えます
高解像度デバイスでは 同じく 縦横2 ピクセルでも
少し小さ目になります
なぜならこのデバイス内にもっと沢山の ピクセルが詰っているからです
スペースに更にずっとピクセルが詰まった 超解像度デバイスでは
このボタンは実際上とても小さくー
指で押せない位です
指先か爪で触るしかないです
超解像度デバイスだからといってー
指は小さくならないのにー
画面のボタンを押せなければなりません
それで私達は密度に依存しないピクセルを使うのです
ボタンを縦横 2dp に定められます
すると様々なデバイスでこう見えます
物理的サイズは同じですが
内部でAndroid が様々な数のピクセルを 割り当てています
その論理について心配しなくていいです
dp 値でサイズを定める必要があると 覚えればいいだけです
アプリをデザインする際 ボタンのようなタッチターゲットは全て
最小で縦横48dp にするのがお勧めです
48ピクセルではなく48dp であることに 注目して下さい
さもないとこの超解像度デバイスでは 非常に小さくなります
こうするとアプリが誰でも使いやすくなります
これを踏まえた上で
テキストビューのコードを変えていただきます
これから初めて XML を書くのですよ わくわくしますね
まずテキストビューのテキストを変えて下さい
次にテキストビューのサイズを変えて下さい
次にエラーを作って下さい 暗い顔？
そうしてそれを取り消して下さい 明るい顔ね
TextView 코드를 처음으로 봤죠.
>> 이건 림보에 빠져있어요.
>> 그래요, 우리가 이걸 사용할 공간이 필요해요.
>> 네, 그 공간은 IDE예요.
>> 다시 그 약자군요.
캐서린, 그건 무엇의 약자죠?
>> 통합 개발 환경이요. >> 좋아요
우리는 이 강의에서 Android Studio를 사용하죠.
그건 이렇게 보여요.
아직 조금 두렵게 하는 거죠.
>> 네, 제 생각에
우리 학생들이 더 쉽게 발전하도록 도울 것이 필요해요.
>> 맞아요, 우리는 무언가를 개발하는 데 일했는데,
그건 보조 바퀴가 되는 Android Studio에서 였고,
이는 컴퓨터의 난해한 약자로 불리는 XMLV 입니다.
>> 이는 XML 가시화 도구입니다.
>> XML을 조금 써요?
결과를 볼 거예요.
당신이 조금 더 쓰면, 더 많은 결과를 갖겠죠.
>> 네.
사용해봐요.
>> 좋아요.
>> XML 가시화 도구는 이 코스를 위해 특별히 만들어 졌어요.
이것은 Android Studio가 제공하는 모든 기능을 제공하지 않아요.
하지만 이 수업의 과제에서
Android Studio로 갈 것이고 이 사이트를 더 사용하지 않을 거예요.
따라오고 싶다면 instructor note에 링크가 있어요.
이 코드에서, 텍스트는 Happy Birthday라고 해요.
우리가 기기를 보면 Happy Birthday라고 말하죠.
이제 텍스트를 Happy Birthday, Kunal로 바꿔봅시다.
기기 미리보기를 확대하면 이것이 Happy Birthday, Kunal
이라고 말하는 것이 보여요.
너비와 높이에 무엇이 발생할까요?
좀 추상적인 숫자 300dp를 너비로
500dp를 높이도 고를게요.
이제 미리보기 화면에서 더 커진 TextView를 볼 수 있죠.
하지만 텍스트는 여전히 같은 사이즈로 왼편 위쪽에 있어요.
너비와 높이를 300, 500으로 두었을 때
각각 dp가 붙는 것이 보이시죠.
이것은 센티미터나 밀리미터 같은 측정의 단위인데
안드로이드의 뷰 사이즈를 나타내는 데 사용됩니다.
뷰들 사이의 거리도 마찬가지고요.
단위 dp는 density- independent pixels의 약자입니다.
이게 왜 필요한지 설명해드릴게요.
다른 기기를 대신하는 예쁘게 그려진 직사각형이 있다고 합시다.
그들은 물리적으로 같은 사이즈지만 해상도에 따라서는 다릅니다.
이는 화면에 중간 정도 픽셀수를 가진 중간 해상도의 기기예요.
높은 해상도와 매우 높은 해상도 기기고요.
픽셀은, 폰 화면은 매우 작고 많은 사각형으로 이루어져 있어요.
그것은 픽셀이고 그들이 당신이 보는 것을 만들죠.
뷰의 사이즈를 정의하면, 예를 들어, 버튼을 2픽셀 높이
2픽셀 너비로 정의하면, 중간 해상도 기기에선 이렇게 보여요.
해상도가 높은 기기에서는 이것도 2픽셀, 2픽셀이지만
약간 더 작습니다.
이 기기에 박힌 픽셀이 더 많기 떄문이죠.
매우 높은 해상도 기기에선 매우 더 많은 픽셀이 이 공간에 있어
그래서 버튼은 정말 작죠.
이것을 거의 손가락으로 누를 수도 없어요.
닿기 위해서 손가락 끝과 손톱을 사용해야 해요.
제가 매우 해상도가 높은 기기를 가졌다고해서
제가 더 작은 손가락을 가지는 건 아니에요.
저는 여전히 화면 상의 버튼을 누르고 싶어요.
그래서 density-independent pixel이 있어요.
저는 버튼을 2dps 높이 2dps 너비로 정의해요.
이것이 다른 기기에서 이렇게 보여져요.
이는 물리적으로 같은 사이즈지만
안드로이드 내부에서는 다른 수의 픽셀로 그려내죠.
당신은 이 논리에 대해 걱정할 필요 없어요.
당신이 기억할 모든 것은 dp값으로 사이즈를 정의하는 것입니다.
당신 앱을 디자인할 때, 버튼 같은 터치할 대상을
최소한 48dps 높이 너비로 만드는 것을 권장합니다.
48dps를 말하는 것이지 48픽셀이 아닙니다.
그렇지 않으면 초고해상도 기기에서 매우 작아질 것입니다.
이는 모두가 앱을 쉽게 사용하도록 해줄거예요.
이 모든 지식을 바탕으로 당신이 TextView 코드를
지금 바꿔보길 바랍니다.
당신은 XML의 첫 행을 쓰는 거예요. 정말 흥분되죠.
먼저 TextView 안의 텍스트를 바꿔보세요.
그리고 TextView의 주변을 바꿔보세요.
에러를 만들어보세요. 슬픈 표정.
그리고 다시 고쳐보세요. 기쁜 표정.
Então nós vimos código de TextView pela primeira vez.
- Mas é como estar em um limbo. Certo!
Precisamos de um espaço onde possamos colocar tudo.
Sim, e esse espaço é um IDE.
Oi, essas siglas de novo.
O que isso significa, Katherine?
- Ambiente de Desenvolvimento Integrado - Ok.
E nós vamos utilizar o Android Studio nesta aula.
E é parecido com isso.
Ainda um pouco intimidante.
Sim, acho que precisamos de algo
que ajudará os nosso alunos a entender um pouco melhor.
Vimos desenvolvendo algo
que é Android Studio para iniciantes, com siglas bastante complicadas
da ciência da computação, que estamos chamando XMLV.
- Quer dizer Visualizador XML. - Então você escreve um pouco de XML...
E verá o resultado, escreve mais...
- E verá mais resultados. - Sim!
- Então vamos usá-lo. - Ok.
Como este visualizador de XML foi criado especificamente para este curso,
ele não irá fornecer todas as funcionalidades que o Android Studio suporta.
Mas, posteriormente, no conjunto de problemas desta lição,
vamos fazê-lo usar o Android Studio, e não vai mais precisar deste site.
O link está nas notas do instrutor, se quiser acompanhar.
Neste código, o texto diz "Parabéns!".
Então, quando eu olho para o dispositivo, diz "Parabéns!".
Agora vamos tentar mudar o texto para "Parabéns, Kunal!".
E quando der zoom na visualização, você verá que ele agora diz:
"Parabéns, Kunal!"
E o que sucede se eu mudar a largura e a altura?
Eu vou escolher alguns valores arbitrários como 300 dp
para a largura e 500 dp para a altura.
Agora no painel de visualização, você verá que a TextView é muito maior.
O texto, porém, ainda é do mesmo tamanho no canto superior esquerdo.
Note que os valores de largura e altura de 300 e 500
são seguidos pela sigla dp em cada caso.
Esta é uma unidade de medida, como centímetros ou milímetros,
que usamos para descrever o tamanho de views no Android,
bem como o distanciamento entre as views.
A unidade "dp" significa pixels independentes de densidade.
Eu explico por que precisamos disso.
Digamos que esses lindos retângulos representam diferentes dispositivos.
Eles são do mesmo tamanho físico, mas diferem em termos de resolução.
Este é um dispositivo de média resolução com um número médio de pixels na tela,
dispositivo de alta resolução e dispositivo de resolução extra-alta.
Quando eu digo pixel, quero dizer
que a tela do celular possui vários quadrados minúsculos, que são os pixels,
que acendem com base no que você está olhando.
Se eu definir o tamanho de uma view, por exemplo um botão,
para 2 pixels de altura por 2 pixels de largura,
isto é o que aparentaria em um dispositivo de média resolução.
Em um dispositivo de alta resolução,
também seria 2 pixels por 2 pixels.
Mas é menor porque tem mais pixels se comprimindo no dispositivo.
E em um dispositivo de resolução extra alta,
tem muitos mais pixels comprimidos.
Dentro deste espaço, o botão é, na verdade, muito pequeno.
Eu mal posso tocar nele com o meu dedo.
Tenho que usar a ponta do meu dedo, ou a unha, para tocá-lo.
Só porque eu tenho um dispositivo de resolução extra alta,
não significa que eu tenho um dedo menor.
Eu ainda quero ser capaz de tocar os botões na tela.
Por isso temos pixels independentes de densidade.
Eu posso definir o meu botão para ser 2 dps de altura por 2 dps de largura.
Isto é como ficaria em diferentes dispositivos.
É o mesmo tamanho físico,
mas, internamente, o Android mapeia para um número diferente de pixels.
Mas não se preocupe com isso,
lembre apenas
que precisa definir seus tamanhos em termos de valores "dp".
Ao construir seus apps, recomendamos
que todos os alvos sensíveis ao toque, como botões,
tenham, pelo menos, 48 dps de altura e largura.
Observe que dizemos 48 dps e não 48 pixels,
senão seria muito pequeno neste dispositivo de resolução extra alta.
Isto fará o seu app fácil de usar para qualquer pessoa.
Com todo esse conhecimento, eu quero que você experimente
alterar o código da TextView agora.
Você está escrevendo suas primeiras linhas de XML, que emocionante!
Primeiro tente mudar o texto na TextView.
Em seguida, tente mudar os lados da TextView.
Depois quero que você tente gerar um erro, ":(",
E, então, que você o desfaça,":)".
Итак, мы увидели код для TextView в первый раз.
Но пока он завис где-то на орбите.
Верно, нам надо куда-то его установить.
Да, это будет IDE.
Опять это сокращение.
Катрин, напомни что он значит?
Integrated Development Environment
Верно, в этом уроке мы будем использовать Android Studio.
Вот как это выглядит.
Все еще немного запутанно.
Думаю, надо что-то, что поможет ученикам
легче понимать урок.
Верно, мы будем разрабатывать что-то учебное в
Android Studio с традиционными запутанными
компьютерными сокращениями, мы называем это XMLV.
Это значит XML Visualizer.
Ты напишешь немного XML?
Увидишь результат.
Ты напишешь еще, и результата будет больше.
Ага.
Используем его.
Ладно.
Поскольку XML visualizer был создан для этого курса,
в нем не весь функицонал как в Android Studio.
Но во время урока, когда будет надо, мы
перейдем в Android Studio и этот сайт больше не будет нужен.
Ссылка на заметки, которым вы можете следовать.
В этом коде текст - это Happy Birthday.
И на устройстве пишет Happy Birthday.
А сейчас попробуем изменить текст на Happy Birthday, Kunal.
И когда я выведу его на устройство, мы увидим
Happy Birthday, Kunal.
И что случится, если я попробую оставить высоту и ширину.
Возьму случайное значение в 300dp для ширины
и 500 для высоты.
Теперь на предпросмотре вы видите, что зона текста стала гораздо больше.
А текст в верхнем левом углу остался того же размера.
Обратите внимание что значения ширины и высоты -
300 и 500 указаны в dp в обеих случаях.
Это единица измерения, как сантиметр или
миллиметр, с ее помощью мы определяем размер в Android.
А также расстояние между раскладками.
Название dp значит density-independent pixels.
Позвольте объяснить для чего нам это надо.
Допустим этот красивый прямоугольник представляет разные устройства.
Они одинакового размера но отличаются разрешением.
Это устройство среднего разрешения со средним количеством пикселей,
устройство с высоким и очень высоким разрешением.
Когда я говорю пиксель это значит что экран состояит из маленьких квадратов
пикселей, и они светятся тем на что вы смотрите.
Я определяю размер предмета, например кнопки, в 2 пикселя высотой
и 2 писеля шириной и вот так он выглядит на среднем разрешении.
На высоком разрешении это тоже 2 пикселя на 2 пикселя.
Но немного меньше размером,
потому что всего пикселей гораздо больше в устройстве и
на очень высоком разрешении тонны пикселей стоят на такой же площади
и кнопка выглядит очень маленькой.
Я с трудом попадаю по ней пальцем.
Приходится нажимать самым кончиком или ногтем.
Если у меня устройство с очень высоким разрешением
это не значит что у меня маленькие пальцы.
Мне все также надо нажимать кнопки на экране.
Вот поэтому мы пользуемся density-independent pixels.
Я могу указать что кнопка будет 2dps на 2dps размером.
Вот так это будет выглядеть на разных устройствах.
Физически тот же размер, но
в Android используется разное количество пикселей.
Не заморачивайтесь про эту логику, вам только надо помнить,
что надо определять размеры в dp.
При конструировании приложений мы советуем чтобы все кнопки
были размером как минимум 48dps в высоту и ширину.
Обратите внмимание 48dps а не 48 пикселей,
иначе она будет очень маленькой на устройстве с высоким разрешением.
Так всем будет легко пользоваться вашим приложением.
Теперь когда вы все это знаете, я хочу чтобы вы попробовали
изменить код TextView.
Вы напишете свои первые строки XML, это удивительно.
Сначала попробуйте изменить текст в TextView.
Потом попробуйте изменить стороны в TextView.
Потом я хочу чтобы вы сделали ошибку.
А потом исправили ее, отменив.
Tamam, TextView kodunu ilk defa gördük.
Ancak daha tam yerli yerine oturmadı.
Yerleştireceğimiz bir alana ihtiyaç var.
O alan da bir IDE.
Yeniden o kısaltma.
Neyin kısaltmasıydı, Katherine?
Integrated Development Enviroment (Tümleşik Geliştirme Ortamı).
Evet ve bu derste Android Studio'yu kullanacağız.
İşte böyle gözüküyor.
Hâlâ biraz ürkütücü.
Evet. Öğrencimizin daha da
hızlanması için bir şeylere ihtiyacımız var.
Evet, destek tekerlekli Android Studio diyebileceğimiz
bir şey geliştirmeye çalışıyoruz, bilgisayar biliminin karışık
isim kısaltma geleneğine göre XMLV diyoruz.
XML Visualizer (Görüntüleyici) anlamında.
Biraz XML yazıyorsun, sonra çıktıya bakıyorsun.
Biraz daha yazıp, tekrar çıktılara bakıyorsun.
Evet, kullanıp görelim.
Tamam.
XML Visualizer sırf bu kurs için tasarlandığından
Android Studio'nun sunduğu olanakları sağlamayacaktır.
Eninde sonunda, bu ders setinde,
sizi Android Studio ile tanıştıracağız, böylece bu siteye ihtiyacınız olmayacak.
Takip etmek isterseniz eğitmen notlarında bir bağlantı var.
Bu kod için, metinde Happy Birthday! yazıyor.
Cihaza baktığımda da Happy Birthday! yazıyor.
Metini değiştirip Happy Birthday, Kunal! yazalım.
Cihaza yakınlaştığımda önizlemede görüyorsunuz ki
Happy Birthday, Kunal! yazıyor.
Genişlik, yükseklik değerlerini değiştirince ne oluyor görelim.
Genişlik için 300 dp ve yükseklik için 500 dp
gibi rastgele değerler veriyorum.
Önizlemede TextView'in daha büyük olduğunu gördük.
Ancak metin aynı boyutta sol üst köşede duruyor.
Genişlik değeri 300, yükseklik değeri 500,
değerleri dp ile tanımlandığına dikkat edin.
Bu ölçü birimini santimetre, milimetre gibi, Android'de
görüntü boyutlarını tanımlamak için kullanıyoruz.
Aynı şekilde görüntüler arası uzaklık için de.
Dp'nin açılımı, density-independent pixels (Yoğunluktan bağımsız pikseller).
Bunu neden kullandığımızı açıklayayım.
Bu güzelce çizilmiş dörtgenler farklı cihazları temsil etsin.
Fiziksel olarak aynı boyuttalar, ancak çözünürlük olarak farklılar.
Orta çözünürlüklü bir cihaz için orta sayıda piksel var ekranda.
Yüksek çözünürlüklü bir cihaz ve ekstra yüksek çözünürlüklü bir cihaz var.
Piksel dediğim zaman birçok küçük kareden oluşan telefon ekranı,
küçük kareler piksel, neye baktığınıza göre ışık veriyorlar.
Bir görüntünün boyutlarını belirliyorum, örneğin, bir buton, 2 piksel boyunda,
2 piksel genişliğinde, orta çözünürlüklü bir cihazda böyle gözükecek.
Yüksek çözünürlüklü cihazda 2 piksele 2 piksel olacak,
ancak daha küçük.
Çünkü cihaz üzerinde daha fazla piksel var.
Ekstra yüksek çözünürlüklü bir cihazda daha fazla piksel olduğundan
bu alanda, buton bayağı küçük.
Parmağımla zor dokunuyorum.
Parmağımın kenarları ya da tırnağımı kullanıyorum.
Ekstra çözünürlüklü cihazım var diye,
daha küçük parmağım olacak değil.
Ekrandaki butonlara yine de dokumak istiyorum.
İşte bu yüzden yoğunluktan bağımsız pikseller var.
Butonumu 2 dp boy, 2 dp en olarak tanımlayabilirim.
Farklı cihazlarda böyle gözükecektir.
Fiziksel olarak aynı, ancak
arka planda Android farklı sayıda piksele tanımlıyor.
Bunları dert etmenize gerek yok, ancak şunu hatırlayın,
boyutları dp değerleriyle tanımlamalısınız.
Uygulama tasarlarken buton gibi tüm dokunulacak görüntüler
en azından 48 dp boy ve 48 dp en olmalı.
48 piksel değil, 48 dp dikkat edin,
diğer türlü ekstra yüksek çözünürlüklü cihazlarda çok küçük olur.
Bu uygulamanızı herkes için kolay kullanılır yapacak.
Tüm bu bildiklerinizle, şimdi TextView kodunu
değiştirmenizi istiyorum.
XML'de ilk satırlarınızı yazacaksınız, çok heyecanlı.
İlk önce TextView içindeki metni değiştirmeye çalışın.
Sonra da TextView boyutlarını değiştirmeyi deneyin.
Bir hata mutsuz yüzü oluşturmanızı istiyorum.
Sonra da hatayı geri alıp mutlu yüz olarak düzeltmenizi.
Chúng ta đã xem code TextView lần đầu tiên.
Nhưng vẫn chỉ giống cưỡi ngựa xem hoa.
Đúng thế, chúng ta cần một không gian để có thể xây một ngôi nhà.
Đúng, không gian đó là một IDE.
Lại là một từ viết tắt nữa.
Nó viết tắt cho gì vậy, Catherine?
Integrated Development Enviroment (môi trường phát triển tích hợp)
Chúng ta sẽ dùng Android Studio trong lớp học này.
Nó trông như thế này.
Vẫn có vẻ hơi đáng sợ.
Đúng vậy. Tôi nghĩ chúng ta cần vài thứ
giúp người học theo dõi dễ hơn.
Đúng, vì vậy chúng tôi đang tiến hành phát triển vài thứ
tại Android Studio, theo truyền thống viết tắt
trong ngành khoa học máy tính, chúng tôi gọi là XMLV.
Có nghĩa là XML Visualizer.
Vậy là bạn đã viết một ít XML?
Hãy xem thành quả nào.
Bạn viết thêm, và nhận thêm thành quả.
Đúng vậy.
Vậy hãy dùng nó.
Được.
Vì XML visualizer này được tạo ra là đặc biệt dành cho khóa học này,
nó sẽ không có tất cả chức năng mà Android Studio hỗ trợ.
Nhưng về vấn đề được đặt ra trong bài học này,
chúng tôi sẽ đưa bạn vào Android Studio và bạn sẽ không cần tới website này nữa.
Có một đường link ở mục instructor notes nếu bạn muốn vào.
Với code này, dòng text ghi là Happy Birthday.
Vậy là khi tôi nhìn vào thiết bị, nó sẽ hiện Happy Birthday.
Giờ hãy thử thay đổi dòng text thành Happy Birthday, Kunal.
Và khi tôi phóng to thiết bị để bạn thấy thì nó sẽ là
Happy Birthday, Kunal.
Và điều gì xảy ra khi cố thay đổi độ rộng và chiều cao.
Tôi sẽ chọn vài giá trị bất thường như 300dp cho độ rộng
và 500 cho độ cao.
Giờ trong khung preview, bạn thấy TextView lớn hơn nhiều.
Tuy vậy, dòng text vẫn có kích cỡ như cũ ở góc trên lề trái.
Chú ý rằng độ rộng 300 và chiều cao 500
được gắn đuôi dp.
Đây là đơn vị đo lường như xăng-ti-mét
hay mi-li-mét được dùng để mô tả kích cỡ view trên Android.
Cũng như khoảng cách giữa các view.
Đơn vị dp là viết tắt của density-independent pixels.
Tôi sẽ giải thích lý do chúng ta cần nó.
Những hình chữ nhật được vẽ này đại diện cho các thiết bị khác nhau.
Chúng có cùng kích cỡ vật lý, nhưng lại khác nhau về độ phân giải.
Đây là thiết bị có độ phân giải trung bình với số pixel trung bình trên màn hình,
thiết bị có độ phân giải cao và cực cao.
Khi tôi nói pixel, ý tôi màn hình di động được tạo lên từ nhiều ô vuông nhỏ,
gọi là pixel, và chúng sáng lên dựa vào những gì bạn đang nhìn thấy.
Vậy nếu định nghĩa kích thước của 1 view, ví dụ như một button là cao 2 pixel
và rộng 2 pixel, đây là những gì bạn thấy ở thiết bị có độ phân giải trung bình.
Trên thiết bị phân giải cao, cũng vẫn là 2x2 pixel.
Nhưng nó nhỏ hơn,
vì có nhiều pixel được đưa vào thiết bị này,
và trên thiết bị phân giải cực cao có nhiều pixel hơn cả
thì button này thực sự rất nhỏ.
Tôi khó mà có thể dùng ngón tay gõ vào nó.
Tôi phải dùng mé ngón tay hay móng tay để chạm vào.
Chỉ vì tôi có thiết bị phân giải cực cao,
không có nghĩa tôi có ngón tay nhỏ hơn.
Tôi vẫn muốn có thể chạm vào button trên màn hình.
Và đó là lý do chúng ta có density-independent pixel.
Tôi có thể cho button của mình cao 2dps và rộng 2dps.
Nó sẽ giống như thế này ở trên các thiết bị khác nhau.
Chúng có cùng kích cỡ vật lý,
nhưng đằng sau Android đã dùng số lượng pixel khác nhau.
Bạn không phải lo lý giải điều này, chỉ cần nhớ là
bạn cần xác định kích cỡ theo đơn vị dp.
Khi thiết kể app của mình, chúng tôi khuyên những điểm chạm như button
nên cao và rộng ít nhất 48dps.
Chú ý là 48 dp chứ không phải 48 pixel,
nếu không nó sẽ rất bé trên thiết bị phân giải cực cao.
Điều này sẽ giúp app của bạn dễ dùng hơn với mọi người.
Với tất cả những điều trên, giờ tôi muốn bạn thử
thay đổi code TextView.
Bạn sẽ viết những dòng XML đầu tiên, thật hào hứng.
Đầu tiên hãy cố thay đổi dòng text trong TextView.
Rồi cố thay đổi kích thước TextView.
Sau đó tôi muốn bạn mắc lỗi, mặt buồn.
Rồi muốn bạn làm lại nó, mặt vui.
我们第一次已经见过 TextView 代码
但还是有点迷惑
是的 我们需要一个地方来安置它
这个地方是 IDE
又是缩写
回答一下它代表什么 Catherine？
— 集成开发环境 — 对
我们在课堂上会使用 Android Studio
这是它的界面
还是有点吓人
我想我们应该需要些东西
来帮助初学者快速上手
我们正开发一些
Android Studio 的培训软件
按照计算机科学中传统缩写方案 我们称它为 XMLV
是一款 XML 可视化工具
你写了一些 XML ？
看看输出
写的越多 输出越多
对
我们开始使用它
好
由于 XML 可视化工具 是专为本课程设置的
它不会提供 Android Studio 所有支持的功能
但在本课最后的问题中
我们会让你用 Android Studio你不再需要这个网站
如果你要跟着做 可以在讲师注释上找到链接
对于这个代码 文字显示 Happy Birthday
我们可以看到设备上显示 Happy Birthday
现在我们将文本改成 Happy Birthday, Kunal
然后在设备上放大预览
现在显示的是 Happy Birthday, Kunal.
如果改变宽和高会发生什么
我取个随意值
宽300 高500
现在 在预览窗口 TextView 区域变大了
然而 左上角的文本还是相同大小
注意宽300和
高500后面跟着的 dp
这是一个测量单位 像厘米
或毫米一样 我们用它来描述Android视图的大小
以及视图间的距离
单位 dp 表示独立密度像素
我来解释一下为什么我们需要这个
假设这些矩形代表不同的设备
它们大小一样 但是分辨率不同
这个是中等分辨率的设备 在屏幕上像素的数目中等
高分辨率和极高分辨率的设备
这里说的像素 意思是手机屏幕是由很多称之为像素的小方格构成
它们根据你看的东西被点亮
如果我定义一个视图的大小 例如 一个按键 高2像素
宽2像素 它在中等分辨率的设备上看起来是这样的
在高分辨率设备上 它也是2像素乘2像素
但是看起来会小一些
因为在手机上有更多的像素堆砌在一起
在极高分辨率设备上 会有更多像素堆砌在一个空间
按钮看起来更小
我都无法用手指去点击它
我必须用手指边缘或指甲去点击它
因为我有极高分辨率设备
不代表我有更小的手指
我还是想点击屏幕上的按键
这就是为什么我们需要 dp
我可以定义按键高2像素宽2像素
这就是在不同设备上它的样子
它们有相同的大小
但在Android内部它用不同数目的像素绘制
你不用担心这些逻辑
你只要记住你需要 dp 值来定义视图的大小
设计应用时 我们建议所有可触摸的目标 如按键
宽和高至少为48 dps
注意是48 dps 不是48像素
否则在超高分辨率设备上 它看起来会特别的小
对使用者来说 你的应用会好用好多
有了这些知识 我想让你现在尝试一下
现在修改 TextView 代码
你会激动地写你的第一行 XML代码
第一个尝试是改写 TextView 的文本
然后尝试改写 TextView 的位置
接着我想让你尝试写出一个悲伤的脸
然后撤销 改成一个开心的脸
好了, 我們第一次看過文字顯示編碼。
但它似乎仍然未有決定。
對, 我們於屋內是需要有空位。
對, 空位是一個IDE。
這裡再一次出現首字母縮略字 6 00:00:12,580 --> 00:00:13,721 Catherine,這代表什麼?
進階環境發展對, 及
我們會於堂上用安桌工作坊。
就會看似這樣。
仍然有點令人膽怯的。
對。我認為我們需要一些東西
去幫助我們的學者去容易一點立足。
對, 所以我們在發展一些東西在
安桌工作坊於訓導汽車, 於錯綜複雜的傳統
首字母縮略詞於電腦科學, 我們叫作XMLV。
意思是XML觀看台。
所以你寫一點XML?
你可以看到輸出。
你再寫多一些, 你可以再看到多些輸出。
對。
我們前往使用。
好了。
由於這XML觀看台是等別為這課堂而設的。
它不會提供所有安桌工作坊支持的工能。
但最終於這課堂的問題,
我們讓你進安桌工作坊因此你不再需要這網址。
連結在指令筆記內。若你想跟著。
這個編碼, 文字說生日快樂。
所以當我看著裝置它說生日快樂。
現在我們改文字為Kunal, 生日快樂。
之後當我放大裝置的預設看它現在說,
Kunal, 生日快樂。
stand the width and the height. 而當高或闊不變時會發生什麼。
我會用一些武斷值如300點給
闊及500給高度。
現在於預看台, 你看到文字顯示大很多。
但文字, 仍是於左上角同一大小。
留意300值的闊及高及
500是被點跟隨於每一個情況。
這是量度的單位如厘米或
豪米,我們用來形容安桌顯示的大小。
及圖像之間的距離。
點單位意思是獨立點數象素。
讓我解釋為何我們需要。
話說這些美麗的長方形代表不同的裝置。
他們的大小相同, 但象素卻不同。
這是一個中等象素的裝置及 一個中等數象素於屏幕,
高象素及特高象素的裝置。
當我說象素, 我意思是電話屏幕是由很多小細正方形組成,
即是象素,而當你們看著時會被亮著。
所以當我例明圖像的大小, 例如, 按扭, 要2點高
及2點闊, 這就是於中等象素裝置上看來會如何。
於高象素裝置, 它會是2點對2點。
但它細小很多,
因為這有很多點試著堆於裝置上,及
於特高象素裝置會有超多點子堆
於空位上,這按扭其實很細。
我很難手手指按上。
我要用手指邊或手指甲去按上。
只因為我有特高象素裝置,
不代表我有小手指。
我仍然想按屏幕上的按扭。
而這就是我們有獨立點子素的原因。
我可以較我的按扭到2點高及2點闊。
這於裝置上會看似這樣。
這是實則的大小, 但
於安桌機件下是不同象素的數目。
你不用擔心這些邏輯,你只需要記著
你只需要用點數來改變大小。
當設計你的程式時, 我們建議所有按扭
起碼要48點高及闊。
留意它說48點而不是48象素,
否則於這特高象素裝置看來會很細。
這會令你的程式對於所有人都很易用。
所以有了這些知識我想你試
現在改變文字顯然編碼。
你將會寫你第一行的XML程式, 真興奮。
所以首先改變文字顯示內的文字。
之後試試改變文字顯示的則邊。
之後我想你試制作一個錯誤不開心臉。
之後我想你取消,開心臉。