جستجو و های لایت کردن متن در اندروید

آشنایی با نحوه جستجو و های لایت متن در اندروید


بسیاری از اپلیکیشن ها فیلدی را در اختیار کاربر قرار می دهند که از طریق آن می تواند کلیدواژه ای را در بخش های خاصی از اپلیکیشن جستجو کند، برای اینکه یافتن بخش موردنظر آسان تر شود، نتایج پیدا شده به صورت های لایت شده به کاربر نمایش داده می شوند و در این مطلب قصد داریم به نحوه های لایت کردن متن بر اساس کلیدواژه جستجو شده کاربر بپردازیم، با ما همراه باشید.

برای این کار از SnappableString استفاده شده است.

اول از همه باید یک لی اوت ساده با یک EditText و TextView بسازید. در زیر کد XML موردنظر برای این کار را مشاهده می کنید.

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"

xmlns:app="http://schemas.android.com/apk/res-auto"

xmlns:tools="http://schemas.android.com/tools"

android:layout_width="match_parent"

android:layout_height="match_parent"

android:orientation="vertical"

tools:context="app.com.thetechnocafe.tutorials.HighlightTextActivity">

<EditText

android:id="@+id/search_edit_text"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:layout_margin="16dp"

android:hint="Search" />

<TextView

android:id="@+id/text_view"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:layout_margin="16dp"

android:text="@string/long_text" />

</LinearLayout>

با اجرای اپلیکیشن باید چیزی مشابه تصویر زیر را مشاهده کنید

جستجو و های لایت کردن متن در اندروید

حال در اکتیویتی به این ویوها رفرنس بدهید

mSearchEditText = (EditText) findViewById(R.id.search_edit_text);

mTextView = (TextView) findViewById(R.id.text_view);

یک TextWatcher به EditText اضافه کنید که بر اساس ایونت تغییر متن فراخوانی می شود. تابعی به نام (highlightString(String s را در onTextChange مربوط به TextWatcher فراخوانی کنید، این تابع کد موردنظر برای های لایت کردن متن را در خود جای داده است.

//Add a TextWatcher to EditText to listen to text change event

mSearchEditText.addTextChangedListener(new TextWatcher() {

@Override

public void beforeTextChanged(CharSequence s, int start, int count, int after) {

}

@Override

public void onTextChanged(CharSequence s, int start, int before, int count) {

highlightString(s.toString());

}

@Override

public void afterTextChanged(Editable s) {

}

});

حال باید به پیاده سازی بخش هیجان انگیز یعنی های لایت کردن متن بپردازیم!

تابع زیر را به اکتیویتی خود اضافه کنید.

private void highlightString(String input) {

//Get the text from text view and create a spannable string

SpannableString spannableString = new SpannableString(mTextView.getText());

//Get the previous spans and remove them

BackgroundColorSpan[] backgroundSpans = spannableString.getSpans(0, spannableString.length(), BackgroundColorSpan.class);

for (BackgroundColorSpan span: backgroundSpans) {

spannableString.removeSpan(span);

}

//Search for all occurrences of the keyword in the string

int indexOfKeyword = spannableString.toString().indexOf(input);

while (indexOfKeyword > 0) {

//Create a background color span on the keyword

spannableString.setSpan(new BackgroundColorSpan(Color.YELLOW), indexOfKeyword, indexOfKeyword + input.length(), Spanned.SPAN_EXCLUSIVE_EXCLUSIVE);

//Get the next index of the keyword

indexOfKeyword = spannableString.toString().indexOf(input, indexOfKeyword + input.length());

}

//Set the final text on TextView

mTextView.setText(spannableString);

}

حال می خواهیم به جزئیات این کد نگاهی بیندازیم:

- اول از همه ورودی را که در اینجا همان کلیدواژه موردنظر برای های لایت شدن است دریافت می کنیم که در نقش پارامتر تابع ظاهر می شود.

- پس از آن با دریافت متن از TextView یک SnappableString می سازیم.

- در این مرحله لازم است تمامی بخشهای های لایت شده از جستجوی قبلی کاربر را پاک کنید، در غیر این صورت با حجمی از متون های لایت شده مواجه می شوید که شاید کاربر به جستجوی آنها نپرداخته باشد و این شرایط موجب سردرگم شدن او می گردد. برای این کار باید همه اسپن ها از نوع BackgroundColorSpan را گرفته و یک حلقه بر روی آرایه تشکیل دهیم و با فراخوانی تابع removeSpan. از snappableString یکی یکی آنها پاک کنیم.

- در این مرحله با استفاده از (snappableString.toString().indexOf(input اولین ایندکس از کلیدواژه را پیدا می کنیم.

- سپس در داخل حلقه یک اسپن جدید از snappableString از نوع (BackgroundColorSpan(Color.Yellow تعیین می کنیم، آرگیومنت های دوم و سوم مشخص می سازند که این اسپن بر روی چه بخشی از متن باید اعمال شود. آرگیومنت چهارم یک فلگ برای اسپن است.

- حال باید دومین وقوع کلیدواژه را با استفاده از متد indexOf. پیدا کنیم، اما این بار باید پارامتر دو را هم ارسال کنیم تا مشخص شود که جستجو برای کلیدواژه از کجا آغاز شود.

- در آخر باید مقدار spannableString را در TextView قرار دهیم.

- حال با اجرای اپلیکیشن و جستجو برای یک عبارت، تمامی نتایج آن به صورت های لایت شده (رنگ زرد) به نمایش درخواهد آمد.جستجو و های لایت کردن متن در اندروید

 

http://thetechnocafe.com برگرفته از

اینها را هم بخوانید