<?xml version="1.0" encoding="UTF-8"?><rss version="2.0"
	xmlns:content="http://purl.org/rss/1.0/modules/content/"
	xmlns:wfw="http://wellformedweb.org/CommentAPI/"
	xmlns:dc="http://purl.org/dc/elements/1.1/"
	xmlns:atom="http://www.w3.org/2005/Atom"
	xmlns:sy="http://purl.org/rss/1.0/modules/syndication/"
	xmlns:slash="http://purl.org/rss/1.0/modules/slash/"
	>

<channel>
	<title>layout çeşitleri arşivleri - Mehmet Kirazlı</title>
	<atom:link href="https://www.mehmetkirazli.com/tag/layout-cesitleri/feed/" rel="self" type="application/rss+xml" />
	<link>https://www.mehmetkirazli.com/tag/layout-cesitleri/</link>
	<description>Yazılımcı Notları</description>
	<lastBuildDate>Thu, 27 Apr 2017 08:43:18 +0000</lastBuildDate>
	<language>tr</language>
	<sy:updatePeriod>
	hourly	</sy:updatePeriod>
	<sy:updateFrequency>
	1	</sy:updateFrequency>
	<generator>https://wordpress.org/?v=6.1.10</generator>

<image>
	<url>https://www.mehmetkirazli.com/wp-content/uploads/2018/04/mehmetkirazlilogo.png</url>
	<title>layout çeşitleri arşivleri - Mehmet Kirazlı</title>
	<link>https://www.mehmetkirazli.com/tag/layout-cesitleri/</link>
	<width>32</width>
	<height>32</height>
</image> 
	<item>
		<title>Android Dersleri 4 : Layout Türleri</title>
		<link>https://www.mehmetkirazli.com/android-dersleri-4-layout-turleri/</link>
					<comments>https://www.mehmetkirazli.com/android-dersleri-4-layout-turleri/#comments</comments>
		
		<dc:creator><![CDATA[Mehmet Kirazlı]]></dc:creator>
		<pubDate>Thu, 31 Jan 2013 14:27:38 +0000</pubDate>
				<category><![CDATA[Android Dersleri]]></category>
		<category><![CDATA[android layout]]></category>
		<category><![CDATA[android layout kullanımı]]></category>
		<category><![CDATA[android layout türleri]]></category>
		<category><![CDATA[android linearlayout]]></category>
		<category><![CDATA[android relative layout]]></category>
		<category><![CDATA[layout çeşitleri]]></category>
		<guid isPermaLink="false">http://www.mehmetkirazli.com/?p=1124</guid>

					<description><![CDATA[<p>Android uygulamalarımızda ekleyeceğimiz kontrollerin belirli bir düzende olmasını istiyorsak layout kullanmamız gerekir. Örneğin buton ve textview kontrollerinin alt alta olmasını, sağa sola kaymadan belirli bir düzende olmasını istiyorsak buna uygun olan layoutları kullanmamız gerekir. Bu derste androidde kullanılan Layout Türlerine değineceğim. Şimdi temel layout türlerini inceleyelim. 1) LinearLayout Bu layout türünde, eklenecek olan nesneler doğrusal &#8230;</p>
<p>The post <a rel="nofollow" href="https://www.mehmetkirazli.com/android-dersleri-4-layout-turleri/">Android Dersleri 4 : Layout Türleri</a> appeared first on <a rel="nofollow" href="https://www.mehmetkirazli.com">Mehmet Kirazlı</a>.</p>
]]></description>
										<content:encoded><![CDATA[<p><span style="color: #333333;">Android uygulamalarımızda ekleyeceğimiz kontrollerin belirli bir düzende olmasını istiyorsak <strong>layout</strong> kullanmamız gerekir. Örneğin <strong>buton</strong> ve <strong>textview</strong> kontrollerinin alt alta olmasını, sağa sola kaymadan belirli bir düzende olmasını istiyorsak buna uygun olan layoutları kullanmamız gerekir. Bu derste androidde kullanılan Layout Türlerine değineceğim.<span id="more-1124"></span> </span></p>
<p><span style="color: #333333;">Şimdi temel layout türlerini inceleyelim.</span></p>
<h2><strong><span style="color: #ff0000;">1) LinearLayout</span></strong></h2>
<p><span style="color: #333333;">Bu layout türünde, eklenecek olan nesneler <strong>doğrusal</strong> olarak eklenir. Eğer <strong>vertical linear layout</strong> kullanırsak alt alta, <strong>horizontal linear layout</strong> kullanırsak yan yana eklenir.  </span></p>
<p>Bunun için soldaki paletlerden <strong>layouts</strong>&#8216;a tıkladıktan sonra <strong>LinearLayout</strong>&#8216;u seçin ve ekrana bırakın. Bıraktıktan sonra boyutlarını büyütebilirsiniz. LinearLayout&#8217;u ekledikten sonra içerisine farklı nesneler sürükleyin. Eğer <strong>vertical</strong> olanı eklediyseniz alt alta eklenecektir. <strong>Horizontal</strong> olanı eklerseniz yan yana eklenecektir. Aşağıda iki farklı layout için nasıl eklendiğini görebilirsiniz.</p>
<p><a href="https://www.mehmetkirazli.com/wp-content/uploads/2013/01/verticallayout.png"><img decoding="async" loading="lazy" class="alignnone wp-image-1127 size-medium" src="https://www.mehmetkirazli.com/wp-content/uploads/2013/01/verticallayout-187x300.png" alt="layout" width="187" height="300" srcset="https://www.mehmetkirazli.com/wp-content/uploads/2013/01/verticallayout-187x300.png 187w, https://www.mehmetkirazli.com/wp-content/uploads/2013/01/verticallayout.png 331w" sizes="(max-width: 187px) 100vw, 187px" /></a> <a href="https://www.mehmetkirazli.com/wp-content/uploads/2013/01/horizontallayout.png"><img decoding="async" loading="lazy" class="alignnone wp-image-1126 size-medium" src="https://www.mehmetkirazli.com/wp-content/uploads/2013/01/horizontallayout-191x300.png" alt="layout" width="191" height="300" srcset="https://www.mehmetkirazli.com/wp-content/uploads/2013/01/horizontallayout-191x300.png 191w, https://www.mehmetkirazli.com/wp-content/uploads/2013/01/horizontallayout.png 336w" sizes="(max-width: 191px) 100vw, 191px" /></a></p>
<p>Sol tarafta <strong>dikey</strong> olarak sağda ise <strong>yatay</strong> olarak yerleşim yaptık. Bu yerleşimleri <span style="color: #ff0000;">xml</span> dosyasından da değiştirebiliriz. Sayfamızın xml tarafında geçtiğimizde aşağıdaki gibi <span style="color: #ff0000;">orientation</span> kısmından <strong>vertical</strong> ya da <strong>horizontal</strong> olarak değiştirebiliriz.</p>
<p><a href="https://www.mehmetkirazli.com/wp-content/uploads/2013/01/linearkod.png"><img decoding="async" loading="lazy" class="alignnone wp-image-1129 size-medium" src="https://www.mehmetkirazli.com/wp-content/uploads/2013/01/linearkod-300x200.png" alt="layout" width="300" height="200" srcset="https://www.mehmetkirazli.com/wp-content/uploads/2013/01/linearkod-300x200.png 300w, https://www.mehmetkirazli.com/wp-content/uploads/2013/01/linearkod.png 396w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p><span style="color: #333333;">Burada şunu da söyleyelim. Eklediğimiz</span> <strong>buton, textview</strong> <span style="color: #333333;">gibi nesneler bu <span style="text-decoration: underline;">layout etiketinin içerisinde</span> olmalıdır. Bakın daha layout etiketini kapatmadan içerisine nesneleri ekledik. Örnek bir layout kodunu verelim. Bakın aşağıdaki kodda, eklediğimiz tüm araçlar, layout etiketi içindedir.</span></p>
<p><a href="https://www.mehmetkirazli.com/wp-content/uploads/2013/01/layoutkod.png"><img decoding="async" loading="lazy" class="alignnone wp-image-1139 size-medium" src="https://www.mehmetkirazli.com/wp-content/uploads/2013/01/layoutkod-300x209.png" alt="layout" width="300" height="209" srcset="https://www.mehmetkirazli.com/wp-content/uploads/2013/01/layoutkod-300x209.png 300w, https://www.mehmetkirazli.com/wp-content/uploads/2013/01/layoutkod.png 528w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<h2><strong><span style="color: #ff0000;">2) FrameLayout</span></strong></h2>
<p>Bu layout tipinde nesneler üst üste biner. Genelde aynı boyutlardaki butonların üst üste gelip, birinin kaybolduğunda diğerinin gözükmesi için kullanılır. Bunun için, bir önceki örnekte <span style="color: #ff0000;">xml</span> kısmında <strong>LinearLayout</strong> yazısını silip <strong>FrameLayout</strong> yazabiliriz ya da araç panelinden tekrar bir <strong>FrameLayout</strong> ekleyebiliriz. Tabiki yeniden eklemek daha iyi olacaktır.</p>
<p><a href="https://www.mehmetkirazli.com/wp-content/uploads/2013/01/framelayout.png"><img decoding="async" loading="lazy" class="alignnone wp-image-1132 size-medium" src="https://www.mehmetkirazli.com/wp-content/uploads/2013/01/framelayout-186x300.png" alt="layout" width="186" height="300" srcset="https://www.mehmetkirazli.com/wp-content/uploads/2013/01/framelayout-186x300.png 186w, https://www.mehmetkirazli.com/wp-content/uploads/2013/01/framelayout.png 338w" sizes="(max-width: 186px) 100vw, 186px" /></a></p>
<p>Bu layout türünde dediğimiz gibi nesneler üst üste biner ve sol üste dayalı şekilde sıralanırlar. xml dosyasındaki kod kısmını ise aşağıda görebilirsiniz.</p>
<p><a href="https://www.mehmetkirazli.com/wp-content/uploads/2013/01/framekod.png"><img decoding="async" loading="lazy" class="alignnone wp-image-1133 size-medium" src="https://www.mehmetkirazli.com/wp-content/uploads/2013/01/framekod-300x228.png" alt="layout" width="300" height="228" srcset="https://www.mehmetkirazli.com/wp-content/uploads/2013/01/framekod-300x228.png 300w, https://www.mehmetkirazli.com/wp-content/uploads/2013/01/framekod.png 539w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>&nbsp;</p>
<h2><strong><span style="color: #ff0000;">3) RelativeLayout</span></strong></h2>
<p><span style="color: #333333;">Bu layout tipini kullanırsak araçlarımızı<span style="text-decoration: underline;"> istediğimiz yere</span> sürükleriz. Varsayılan olarak android uygulamalarında bu layout gelir. Araçlarımızı, sayfamız üzerinde sürüklediğimiz zaman <strong>cetvel</strong> şeklinde koordinatları görebilirsiniz. Bir hiza olmadan istediğimiz gibi araçları yerleştirebiliriz.</span></p>
<p>Şimdi bu layout tipini kullandığımız bir sayfa gösterelim. Kod kısmında ise sadece etiket ismi değişecektir.</p>
<p><a href="https://www.mehmetkirazli.com/wp-content/uploads/2013/01/relativelayout.png"><img decoding="async" loading="lazy" class="alignnone wp-image-1134 size-medium" src="https://www.mehmetkirazli.com/wp-content/uploads/2013/01/relativelayout-189x300.png" alt="layout" width="189" height="300" /></a></p>
<p>Görüldüğü gibi istediğimiz gibi nesneleri konumlandırabiliyoruz.</p>
<p>&nbsp;</p>
<h2><strong><span style="color: #ff0000;">4) TableLayout</span></strong></h2>
<p><span style="color: #333333;">Bu layout türünde ise araçlarımız bir <strong>tablo</strong> şeklinde tutulur. Diğerlerinden farklı olarak bu layout&#8217;u kullandığımızda tablomuza <strong>TableRow</strong> adında satır eklememiz gerekiyor. Bunu yine <strong>layout</strong> penceresinden yapıyoruz. Şimdi ekrandaki nesneleri temizleyelim ve ekrana bir <strong>TableLayout</strong> ekleyelim. Ya da <span style="color: #ff0000;">xml</span> kısmından etiket ismini <strong>TableLayout</strong> da yapabiliriz.</span></p>
<p><a href="https://www.mehmetkirazli.com/wp-content/uploads/2013/01/tablelayout.png"><img decoding="async" loading="lazy" class="alignnone wp-image-1135 size-medium" src="https://www.mehmetkirazli.com/wp-content/uploads/2013/01/tablelayout-190x300.png" alt="layout" width="190" height="300" srcset="https://www.mehmetkirazli.com/wp-content/uploads/2013/01/tablelayout-190x300.png 190w, https://www.mehmetkirazli.com/wp-content/uploads/2013/01/tablelayout.png 338w" sizes="(max-width: 190px) 100vw, 190px" /></a></p>
<p><span style="color: #ff0000;">TableLayout</span> kullanırken her satır için bir <span style="color: #ff0000;">TableRow</span> eklememiz gerekiyor. Burada 3 tane <span style="color: #ff0000;">TableRow</span> ekledik ve her <span style="color: #ff0000;">TableRow</span> içerisine de aynı türden araçlar koyduk.</p>
<p>Biraz önce layout içerisinde layout kullanabileceğimizi söylemiştik. Şimdi TableLayout&#8217;ta boş kalan alt kısma bir <span style="color: #ff0000;">RelativeLayout</span> ekleyelim ve <span style="color: #ff0000;">xml</span> kısmında <span style="color: #333333;"><strong>android:layout_height=&#8221;fill_parent&#8221; </strong>kısmını <span style="color: #ff0000;">wrap_content</span> değil de <span style="color: #ff0000;">fill_parent</span> yapın ve kalan ekranın tamamına yayılmasını sağlayın. Sonra bu layout içerisinde farklı araçlar ekleyin. Son görünüm aşağıdaki gibi olacaktır.</span></p>
<p><a href="https://www.mehmetkirazli.com/wp-content/uploads/2013/01/relativevetable.png"><img decoding="async" loading="lazy" class="alignnone wp-image-1136 size-medium" src="https://www.mehmetkirazli.com/wp-content/uploads/2013/01/relativevetable-192x300.png" alt="layout" width="192" height="300" srcset="https://www.mehmetkirazli.com/wp-content/uploads/2013/01/relativevetable-192x300.png 192w, https://www.mehmetkirazli.com/wp-content/uploads/2013/01/relativevetable.png 338w" sizes="(max-width: 192px) 100vw, 192px" /></a></p>
<p><strong>Not :</strong> Hangi layout&#8217;u kullanırsak kullanalım, sayfamıza araçlardan önce bir <span style="color: #ff0000;">layout</span> eklememiz gerekiyor. Eğer araçlarımızı layout&#8217;umuzun <span style="text-decoration: underline;">dışına</span> eklersek hizalamaya alınmayacaktır. Ekleyeceğimiz tüm nesneler, <span style="color: #ff0000;">xml</span> kısmında bu <span style="color: #ff0000;">layout</span> etiketinin <span style="text-decoration: underline;">içerisinde</span> olmalıdır. Ayrıca layout içerisinde başka layoutlar kullanabiliriz ya da aynı ekranda birbirinden bağımsız farklı layoutlar kullanabiliriz.</p>
<p>Yukarıdaki notta anlattığımız, araçların layout etiketi içerisinde olmasına bir örnek daha verelim. Sayfa başında LinearLayout kullanırken bir örnek vermiştik fakat tabloları ve satırları kullanarak da bir örnek verelim. Hem ekran görüntüsünü hem de xml kodunu vererek konumuzu bitirelim.</p>
<p><a href="https://www.mehmetkirazli.com/wp-content/uploads/2013/01/ekrantablo.png"><img decoding="async" loading="lazy" class="alignnone wp-image-1141 size-medium" src="https://www.mehmetkirazli.com/wp-content/uploads/2013/01/ekrantablo-211x300.png" alt="layout" width="211" height="300" srcset="https://www.mehmetkirazli.com/wp-content/uploads/2013/01/ekrantablo-211x300.png 211w, https://www.mehmetkirazli.com/wp-content/uploads/2013/01/ekrantablo.png 315w" sizes="(max-width: 211px) 100vw, 211px" /></a></p>
<p><a href="https://www.mehmetkirazli.com/wp-content/uploads/2013/01/xmktablo.png"><img decoding="async" loading="lazy" class="alignnone wp-image-1140 size-medium" src="https://www.mehmetkirazli.com/wp-content/uploads/2013/01/xmktablo-300x258.png" alt="layout" width="300" height="258" srcset="https://www.mehmetkirazli.com/wp-content/uploads/2013/01/xmktablo-300x258.png 300w, https://www.mehmetkirazli.com/wp-content/uploads/2013/01/xmktablo.png 517w" sizes="(max-width: 300px) 100vw, 300px" /></a></p>
<p>Temel layout&#8217;lar bu şekildedir. Layout&#8217;a tıkladıktan sonra sağdaki <span style="color: #ff0000;">Properties</span> kısmından farklı ayarlamaları yapabilirsiniz.</p>
<p>The post <a rel="nofollow" href="https://www.mehmetkirazli.com/android-dersleri-4-layout-turleri/">Android Dersleri 4 : Layout Türleri</a> appeared first on <a rel="nofollow" href="https://www.mehmetkirazli.com">Mehmet Kirazlı</a>.</p>
]]></content:encoded>
					
					<wfw:commentRss>https://www.mehmetkirazli.com/android-dersleri-4-layout-turleri/feed/</wfw:commentRss>
			<slash:comments>8</slash:comments>
		
		
			</item>
	</channel>
</rss>
