Anasayfa / Android Dersleri / Android Dersleri 9 : ImageView Kullanımı

Android Dersleri 9 : ImageView Kullanımı

Merhaba arkadaşlar. Bu yazımda, uygulamalarımıza ImageView yani bir nevi resim eklemeyi anlatacağım. Ekleyeceğimiz bu ImageView nesnesi ile resimler ekleyebilir, bunları tıklanabilir hale getirebiliriz.

Şöyle bir basit uygulama yapalım. Sayfamızdaki butona tıkladığımızda alt kısımda bir resim göstersin.

Bir Android Application projesi oluşturalım. Projemizde bulunan tek sayfamıza çift tıklayarak sayfamızın görünüm kısmına geçelim. Sol taraftaki palette kısmından bir buton ve bir imageview sürükleyerek sayfamıza bırakalım. ImageView eklerken bizden bir resim seçmemizi isteyecektir. Projemizde ya da sistemde bulunan resimlerden herhangi birisini ekleyelim. Uygulamamızın görünümü şu şekilde olacaktır. Aşağıdaki siyah resim, sistemden seçtiğimiz herhangi bir resimdir.

android imageview

Şimdi uygulamamızın kod kısmına geçelim. Bu kod kısmını bildiğiniz gibi .java uzantılı dosyamızda yapıyoruz yani src altındaki dosyadan. Bu dosya bizde MainActiviy.java adında bulunuyor. Default olarak da bu isimlerle uygulamamız hazır olarak gelir. Bu kısa bilgiyi verdikten sonra şimdi kod kısmından devam edelim. İlk olarak imageview nesnesi oluşturmamız gerekiyor. Bu nesneyi oluşturduktan sonra hemen görünürlüğünü kapatalım. Kodumuz aşağıdaki gibi olacaktır.

android imageview

Buradaki son satırdaki kod ile, sayfamız açıldığında resmin görünmemesini yani görünmez olmasını sağladık. Bir üst satırda ise imageview nesnesi oluşturduk. Şimdi uygulamamızda drawable-hdpi klasörüne bir resim atalım. Ben adı “images” olan bir araba resmi attım. Daha sonra kod kısmına tekrar dönelim ve butonun listener olayını yazalım. Butona tıklandığında, bu siyah kare şeklindeki resmin yerine bizim belirlediğimiz resmi atasın ve resmi görünür yapsın. Bunun için yazmamız gereken kod aşağıdaki gibidir.

android imageview

b1 nesnesi yani butonun listener olayını yazdık ve içerisine de tıklandığında olacakları yazdık. İlk olarak i nesnesinin yani imageview‘in resim kaynağını değiştirdik. Bunun için setImageResource() metodunu kullandık. Parametre olarak da eklediğimiz resmin adresini verdik. Bunu yaptıktan sonra imageview nesnesinin görünürlüğünü açtık. Bunun için de setVisibility() metodunu kullandık. Biraz öncekinden tek farkı içerisindeki parametredir.

Şunu da dipnot olarak düşelim. Imageview nesnemizi final olarak tanımladık. Eğer bu nesneyi onCreate() metodunun üzerinde ImageView i; diyerek tanımlamış olsaydık final olarak göstermeye gerek kalmayacaktır. Bu sefer onCreate() metodunda da şu şekilde tanımlardık:

i=(ImageView)findViewById(R.id.imageView1);

Uygulamamızı çalıştıralım ve çıktısını görelim.

android imageview android imageview

Butona tıkladığımızda resmimiz tekrar görünür hale gelecektir. Eğer resim kaynağını değiştirmeseydik siyah kare açılacaktı. Şunu da söyleyelim. Resim kaynağını xml kısmında da değiştirebiliriz. Bunun için xml kısmında imageview etiketine şunu eklememiz gerekecekti.

android imageview

Bu src kısmını, siyah renkteki yazıdaki gibi değiştirseydik, program ilk açıldığında zaten “images” adlı resim çıkacaktı. Fakat biz butona tıklandığında değişmesini istediğimiz için başta değil de sonradan değiştirdik. Hem daha çok metod tanımış olduk.

Şimdi de bu resme tıkladığımızda alt tarafta başka bir resim açılsın. Bu da başka bir otomobil olsun. Bunun için bir imageview ve bir resim daha ekleyeceğiz. Bu sefer “images1” adında bir resim daha ekleyelim. Bunu da drawable-hdpi klasörüne atalım.

android imageview

Bir imageview daha ekledik ve eklerken bize resim eklememiz gerektiğini söyledi. Biz de rastgele bir resim ekledik sistemde olanlardan. Dediğimiz gibi xml kısmından da değiştirebiliriz bu resmi. Açılışta doğrudan o resim çıkar.

Uygulamamızın kod kısmında ise aşağıdaki gibi düzenlemeler yapacağız.

android imageview

Burada i2 adında bir imageview nesnesi daha oluşturduk. Dikkat ederseniz bunun tanımlamasını en üstte yaptığımız için final olarak tanımlamak zorunda kalmadık. Daha sonra i nesnesinin listener‘ını yazdık. Bu listener içerisinde de onClick() yani tıklanma olayına da, diğer i2 nesnesinin görünmesini ve resim kaynağı işlemlerini yazdık. Yani i adındaki resme tıklandığında i2 adındaki resim açılsın dedik. İstersek bu resme tıklandığında, bir sayfanın açılması ya da müzik çalması gibi birçok olayı da yapabilirdik.

Uygulama Çalıştırıldığında Ekran Görüntüleri

android imageview android imageview android imageview

Butona tıklandığında çıkan resme tekrar tıkladığımızda altta bir resim daha açıldı.

Bu yazımızda imageview aracının kullanımını anlattım ve en çok kullanılan metodlarına örnek verdik. Bir sonraki derste görüşmek üzere

Hakkında Mehmet Kirazlı

İstanbul Eyüp'te ikamet ediyorum. Giresun Alucra'lıyım. Bilgisayar Mühendisi bölümünden 2013 yılında mezun oldum. "Yeni Başlayanlar için Java 8" kitabının yazarıyım. Şuanda özel bir firmada Mobil Yazılım Geliştirme Uzmanı olarak çalışıyorum.

İlginizi Çekebilir

android dersleri

Android Dersleri 26 : Veritabanı İşlemleri-3 ve SQLite Arayüzü Kullanımı

Merhaba. Bu yazımda, deneyenlerin bazılarının hata aldığını söylediği veritabanı kullanımını tekrar anlatacağım ve SQLite kullanımına …

6 Yorumlar

  1. Hocam, çok sağolun güzel dersler. Peki Butona tıkladığımda telefonun galerisinden herhangi bir resme tıkladığımızda bizim uygulamamızda sectiğimiz resmin görünmesini nasıl sağlayabiliriz?

  2. evet o olay biraz karışıkmış ingilizce bir siteden bulduğum kadarıyla;
    .jawa icine:

    package com.serdarturgut.test;
    import android.os.Bundle;
    import android.app.Activity;
    import android.content.Intent;
    import android.database.Cursor;
    import android.net.Uri;
    import android.provider.MediaStore;
    import android.view.View;
    import android.view.View.OnClickListener;
    import android.widget.Button;
    import android.widget.ImageView;

    public class MainActivity extends Activity {

    private static final int SELECT_PICTURE = 1;

    private String selectedImagePath;
    private ImageView img;

    @Override
    protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_main);
    img = (ImageView)findViewById(R.id.imageView1);

    ((Button) findViewById(R.id.button1))
    .setOnClickListener(new OnClickListener() {
    public void onClick(View arg0) {
    Intent intent = new Intent();
    intent.setType(“image/*”);
    intent.setAction(Intent.ACTION_GET_CONTENT);
    startActivityForResult(Intent.createChooser(intent,”Select Picture”), SELECT_PICTURE);
    }
    });
    }

    public void onActivityResult(int requestCode, int resultCode, Intent data) {
    if (resultCode == RESULT_OK) {
    if (requestCode == SELECT_PICTURE) {
    Uri selectedImageUri = data.getData();
    selectedImagePath = getPath(selectedImageUri);
    System.out.println(“Image Path : ” + selectedImagePath);
    img.setImageURI(selectedImageUri);
    }
    }
    }

    public String getPath(Uri uri) {
    String[] projection = { MediaStore.Images.Media.DATA };
    Cursor cursor = managedQuery(uri, projection, null, null, null);
    int column_index = cursor.getColumnIndexOrThrow(MediaStore.Images.Media.DATA);
    cursor.moveToFirst();
    return cursor.getString(column_index);
    }

    }

    ve .xml de şu şekilde:

    Bu aşamadan sonra aldığımız resmi çift parmak zoom, ve tek parmak taşıma olayına bakayım dedim :S :(. başka kod sayfaları da işin içine giriyor ve işler baya bi karışıyor. Bende adobe flash air for android öğreneyim dedim: resmi galeriden alıyorum, çift el zoom yapabiliyorum ama zoom yaparken taşıma yapamıyorum, taşıma yaparken de zoom yapamıyorum :S. programlama kısmında en son hangi event çağırıldıysa onu kullanabiliyormuş yane en son zoom varsa taşıma yapmıyor, en son taşıma varsa zoom yapmıyor :S. Neyse sizin gibi ders hazırlayan hocalar olduktan sonra çözeriz zaar :).

  3. yukarıdaki mesajıma .xml yi yazmayı unutmuşum:

  4. hocam iyi günler. programdaki resime indir butonu koymak istiyorum yardımcı olurmusunuz

  5. Uygulama nin sayfalarında zoom nasil yapilir acil kod lazım arkadaslar.mesela sayfa resimlerden oluşuyor nasıl zoom yaparım
    .

Bir Cevap Yazın

E-posta hesabınız yayımlanmayacak. Gerekli alanlar * ile işaretlenmişlerdir