Bir çok sosyal medya uygulamasında farklı dillere sahip olan insanların, çocukların dahi duygu ve düşüncelerini kolayca karşı tarafa aktarmak için kullandıkları emojiler aynı zamanda WhatsApp, Facebook, Twitter vb uygulamalarda iletişimi eğlenceli hale getirende simgelerdir.
Bu makalede, SuperNova-Emoji kütüphanesini kullanarak, Android uygulamanıza emoji klavyesini birçok farklı özelleştirme seçeneğini kolayca nasıl entegre edebileceğinizi bahsedeceğim.
1-Basit Şekilde Entegrasyon
Emoji klavyesinin ilk öncelikle nasıl kolay bir şekilde kullanabileceğimizi aşağıdaki kodlardan inceleyebilirsiniz. Context, RootView, EmojiconEditText ve ImageView parametlerine sahip olan EmojiIconActions adındaki sınıf kullanmalıyız. RootView parametresi, klavyenin gösterileceği alanı belirlemek için kullanılır. EmojiconEditText, emoji oluşturmayı etkinleştirmek için özel niteliklere sahip bir EditText’tir. Son parametresi olan ImageView, normal klavye ve emoji klavyesi arasında geçiş yapmak için kullanılacaktır.
1 2 3 |
EmojIconActions emojIcon= new EmojIconActions(this, rootView, emojiconEditText, emojiImageView); emojIcon.ShowEmojIcon(); |
Klasik EditText yerine EmojiconEditText kullanmak isterseniz aşağıdaki xml i yazabilirsiniz.
1 2 3 4 5 |
<hani.momanii.supernova_emoji_library.Helper.EmojiconEditText android:id="@+id/emojicon_edit_text" android:layout_width="match_parent" android:layout_height="wrap_content" emojicon:emojiconSize="28sp" /> |
TextView elementi yerine EmojiconTextView kullanmak isterseniz aşağıdaki xml i yazabilirsiniz.
1 2 3 4 5 |
<hani.momanii.supernova_emoji_library.Helper.EmojiconTextView android:id="@+id/emojicon_text_view" android:layout_width="wrap_content" android:layout_height="wrap_content" emojicon:emojiconSize="28sp"/> |
2- Default Toogle Icon’u Değiştirme
Normal klavye ve emoji klavye arasında geçiş yaparken kullanıcıya görünen iconu değiştirmek istersek, iki parametre alan setIconsIds () metodunu kullanabiliriz.
1 |
emojIcon.setIconsIds(R.drawable.ic_action_keyboard,R.drawable.smiley); |
3- Cihazdaki Default Emojileri Kullanma
SuperNova-Emoji, cihaz emojisini basit yolla kullanmanıza izin verir.Bunun bazı metodlara true değeri vermemiz gerekir.
1 2 3 |
emojIcon.setUseSystemEmoji(true); textView.setUseSystemDefault(true);
emojiconEditText.setUseSystemDefault(true); |
Son olarak xml de EmojiconTextView aşağıdaki özelliği eklemeliyiz.
1 |
emojicon:emojiconUseSystemDefault="true" |
4-Emojilerin Boyutunu Değiştirme
1 |
textView.setEmojiconSize(30); |
Xml code
1 |
emojicon:emojiconSize="28sp" |
5-Klavye Açılıp veya Kapandığını Algılama
SuperNova-Emoji, kullanıcının klavyeyi ne zaman açtığını algılamanıza veya kapatmanız gerektiğinde bazı işlemler gerçekleştirmenize olanak tanır. Klavye kapandığında, açıldığında veya gizlendiğinde kullanıcıya bazı görünümler sunmanız için kullanabilirsiniz. Bunu başarmak için aşağıdaki kod blogunu kullanın.
1 2 3 4 5 6 7 8 9 10 11 |
emojIcon.setKeyboardListener(new EmojIconActions.KeyboardListener() { @Override public void onKeyboardOpen() { Log.i("Keyboard","open"); } @Override public void onKeyboardClose() { Log.i("Keyboard","close"); } }); |
6- Emoji Klavyenin Renklerini Değiştirme
1 2 3 |
EmojIconActions emojIcon= new EmojIconActions(this, rootView, emojiconEditText, emojiImageView,"#F44336","#e8e8e8","#f4f4f4");
emojIcon.ShowEmojIcon(); |
7- Android Proje Oluşturup, Emoji Klavyesini Uygulamak
Dilerseniz aşağıda vermiş olduğum Kod İndir resmine tıklayarak github’a yüklemiş olduğum projeyi indirip, inceleyebilirsiniz.
Kendinizin projeyi oluşturarak uygulamak isterseniz yapmanız gereken adımlar şu şekildedir:
- Android Studio ide’sinde yeni bir proje oluşturalım.
- Oluşturduğum projemin app dizinin altındaki build.gradle dosyasını açıyoruz. Dependencies kod bloklarının arasına aşağıdaki kodları yerleştirerek Supernova Emoji kütüphanesini yüklüyoruz.Son olarak maven reposuna hani-momani urlsini eklemeliyiz.
12345678910repositories {maven { url "https://dl.bintray.com/hani-momanii/maven"}}dependencies {..// Supernova Emojicompile 'hani.momanii.supernova_emoji_library:supernova-emoji-library:0.0.2'} - Res/layout dizinindeki activity_main.xml dosyasını açıp, aşağıdaki kodu eklemelisiniz.
123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263<?xml version="1.0" encoding="utf-8"?><RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"xmlns:emojicon="http://schemas.android.com/apk/res-auto"xmlns:tools="http://schemas.android.com/tools"android:id="@+id/root_view"android:layout_width="match_parent"android:layout_height="match_parent"android:paddingBottom="@dimen/activity_vertical_margin"android:paddingLeft="@dimen/activity_horizontal_margin"android:paddingRight="@dimen/activity_horizontal_margin"android:paddingTop="@dimen/activity_vertical_margin"tools:context="info.androidhive.emojis.MainActivity"><ImageViewandroid:id="@+id/emoji_btn"android:layout_width="40dp"android:layout_height="40dp"android:layout_alignParentBottom="true"android:layout_alignParentLeft="true"android:padding="4dp"android:src="@drawable/ic_insert_emoticon_black_24dp" /><ImageViewandroid:id="@+id/submit_btn"android:layout_width="40dp"android:layout_height="40dp"android:layout_alignParentBottom="true"android:layout_alignParentRight="true"android:padding="4dp"android:src="@android:drawable/ic_menu_send" /><hani.momanii.supernova_emoji_library.Helper.EmojiconEditTextandroid:id="@+id/emojicon_edit_text"android:layout_width="match_parent"android:layout_height="wrap_content"android:layout_alignParentBottom="true"android:layout_toLeftOf="@id/submit_btn"android:layout_toRightOf="@id/emoji_btn"emojicon:emojiconSize="28sp" /><CheckBoxandroid:id="@+id/use_system_default"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_below="@+id/textView"android:layout_centerHorizontal="true"android:checked="false"android:text="Use System Default?" /><hani.momanii.supernova_emoji_library.Helper.EmojiconTextViewandroid:id="@+id/textView"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_centerHorizontal="true"android:layout_centerVertical="true"android:layout_marginTop="26dp"android:text="Hello Emojis!"android:textAppearance="@style/TextAppearance.AppCompat.Large"android:textColor="#000000"emojicon:emojiconSize="45sp"emojicon:emojiconUseSystemDefault="true" /></RelativeLayout> - Şimdi MainActivity.java dosyasını açın ve aşağıda belirtildiği gibi değişiklikleri yapın. Bu etkinlik, yukarıda açıklandığı gibi SuperNova-Emoji uygulamasının farklı senaryolarını göstermektedir.
12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667import android.os.Bundle;import android.support.v7.app.AppCompatActivity;import android.util.Log;import android.view.View;import android.widget.CheckBox;import android.widget.CompoundButton;import android.widget.ImageView;import hani.momanii.supernova_emoji_library.Actions.EmojIconActions;import hani.momanii.supernova_emoji_library.Helper.EmojiconEditText;import hani.momanii.supernova_emoji_library.Helper.EmojiconTextView;public class MainActivity extends AppCompatActivity {private static final String TAG = MainActivity.class.getSimpleName();CheckBox mCheckBox;EmojiconEditText emojiconEditText;EmojiconTextView textView;ImageView emojiImageView;ImageView submitButton;View rootView;EmojIconActions emojIcon;@Overrideprotected void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);setContentView(R.layout.activity_main);rootView = findViewById(R.id.root_view);emojiImageView = (ImageView) findViewById(R.id.emoji_btn);submitButton = (ImageView) findViewById(R.id.submit_btn);mCheckBox = (CheckBox) findViewById(R.id.use_system_default);emojiconEditText = (EmojiconEditText) findViewById(R.id.emojicon_edit_text);textView = (EmojiconTextView) findViewById(R.id.textView);emojIcon = new EmojIconActions(this, rootView, emojiconEditText, emojiImageView);emojIcon.ShowEmojIcon();emojIcon.setIconsIds(R.drawable.ic_action_keyboard, R.drawable.smiley);emojIcon.setKeyboardListener(new EmojIconActions.KeyboardListener() {@Overridepublic void onKeyboardOpen() {Log.e(TAG, "Keyboard opened!");}@Overridepublic void onKeyboardClose() {Log.e(TAG, "Keyboard closed");}});mCheckBox.setOnCheckedChangeListener(new CompoundButton.OnCheckedChangeListener() {@Overridepublic void onCheckedChanged(CompoundButton compoundButton, boolean b) {emojIcon.setUseSystemEmoji(b);textView.setUseSystemDefault(b);}});submitButton.setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View v) {String newText = emojiconEditText.getText().toString();textView.setText(newText);}});}}
Uygulamamızı çalıştırdığımızda böle bir sonuç elde etmiş olduk.
Kaynak
1- https://smality.com/androidde-emoji-klavyesi-entegre-etme/