Fy Projects

DOWNLOAD APK DOWNLOAD RES FOLDER DOWNLOAD PROJECT

Android Create Search Filter Hotel

1. Project Structure

2. Gradle

plugins {
  id 'com.android.application'
}

android {
  compileSdkVersion 30
  buildToolsVersion "30.0.3"

  defaultConfig {
    applicationId "com.search.filterhotel"
    minSdkVersion 19
    targetSdkVersion 30
    versionCode 1
    versionName "1.0"

    testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
  }

  buildTypes {
    release {
      minifyEnabled false
      proguardFiles getDefaultProguardFile('proguard-android-optimize.txt'), 'proguard-rules.pro'
    }
  }
  compileOptions {
    sourceCompatibility JavaVersion.VERSION_1_8
    targetCompatibility JavaVersion.VERSION_1_8
  }
}

dependencies {
  implementation 'com.balysv:material-ripple:1.0.2'
  implementation 'androidx.appcompat:appcompat:1.3.0'
  implementation 'com.google.android.material:material:1.4.0'
  implementation 'androidx.constraintlayout:constraintlayout:2.0.4'
  testImplementation 'junit:junit:4.+'
  androidTestImplementation 'androidx.test.ext:junit:1.1.3'
  androidTestImplementation 'androidx.test.espresso:espresso-core:3.4.0'

  implementation 'com.crystal:crystalrangeseekbar:1.1.3'
}

3. Main Activity

package com.search.filterhotel;

import android.os.Bundle;
import androidx.appcompat.app.AppCompatActivity;
import androidx.appcompat.widget.Toolbar;
import android.view.Menu;
import android.view.MenuItem;
import android.widget.TextView;
import android.widget.Toast;

import com.crystal.crystalrangeseekbar.interfaces.OnRangeSeekbarChangeListener;
import com.search.filterhotel.utils.Tools;
import com.search.filterhotel.widget.RangeSeekBar;

public class MainActivity extends AppCompatActivity {

  private RangeSeekBar range_seek_bar;
  private TextView price_min, price_max;

  @Override
  protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_search_filter_hotel);
    initToolbar();
    initComponent();
  }

  private void initToolbar() {
    Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
    setSupportActionBar(toolbar);
    getSupportActionBar().setTitle("Filter Hotel");
    getSupportActionBar().setDisplayHomeAsUpEnabled(true);
    Tools.setSystemBarColor(this, R.color.grey_5);
    Tools.setSystemBarLight(this);
  }


  private void initComponent() {
    range_seek_bar = (RangeSeekBar) findViewById(R.id.range_seek_bar);
    price_min = (TextView) findViewById(R.id.price_min);
    price_max = (TextView) findViewById(R.id.price_max);

    // set listener
    range_seek_bar.setOnRangeSeekbarChangeListener(new OnRangeSeekbarChangeListener() {
      @Override
      public void valueChanged(Number minValue, Number maxValue) {
        price_min.setText("$" + String.valueOf(minValue));
        price_max.setText("$" + String.valueOf(maxValue));
      }
    });
  }

  @Override
  public boolean onCreateOptionsMenu(Menu menu) {
    getMenuInflater().inflate(R.menu.menu_done, menu);
    Tools.changeMenuIconColor(menu, getResources().getColor(R.color.grey_60));
    return true;
  }


  @Override
  public boolean onOptionsItemSelected(MenuItem item) {
    if (item.getItemId() == android.R.id.home) {
      finish();
    } else {
      Toast.makeText(getApplicationContext(), item.getTitle(), Toast.LENGTH_SHORT).show();
    }
    return super.onOptionsItemSelected(item);
  }
}

4. Widget - RangeSeekBar

package com.search.filterhotel.widget;

import android.content.Context;
import android.util.AttributeSet;

import com.crystal.crystalrangeseekbar.widgets.CrystalRangeSeekbar;

public class RangeSeekBar extends CrystalRangeSeekbar {

  private final int THUMB_SIZE = 40;

  public RangeSeekBar(Context context) {
    super(context);
  }

  public RangeSeekBar(Context context, AttributeSet attrs) {
    super(context, attrs);
  }

  public RangeSeekBar(Context context, AttributeSet attrs, int defStyleAttr) {
    super(context, attrs, defStyleAttr);
  }

  @Override
  protected float getBarHeight() {
    return 8;
  }

  @Override
  protected float getThumbWidth() {
    return THUMB_SIZE;
  }

  @Override
  protected float getThumbHeight() {
    return THUMB_SIZE;
  }

}

4. Layout

<?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"
  android:layout_width="match_parent"
  android:layout_height="match_parent"
  android:background="@android:color/white"
  android:fitsSystemWindows="true"
  android:orientation="vertical">

  <com.google.android.material.appbar.AppBarLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="@style/AppTheme.AppBarOverlay"
    app:elevation="0dp">

    <androidx.appcompat.widget.Toolbar
      android:id="@+id/toolbar"
      android:layout_width="match_parent"
      android:layout_height="?android:attr/actionBarSize"
      android:background="@android:color/white"
      app:contentInsetStartWithNavigation="0dp"
      app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
      app:theme="@style/Toolbar.Light" />

  </com.google.android.material.appbar.AppBarLayout>

  <androidx.core.widget.NestedScrollView
    android:id="@+id/nested_content"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:clipToPadding="false"
    android:scrollbars="vertical"
    android:scrollingCache="true">

    <LinearLayout
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:orientation="vertical"
      android:paddingBottom="@dimen/spacing_mlarge"
      android:paddingLeft="@dimen/spacing_xlarge"
      android:paddingRight="@dimen/spacing_xlarge"
      android:paddingTop="@dimen/spacing_mlarge">

      <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Price Range"
        android:textAppearance="@style/TextAppearance.AppCompat.Title"
        android:textColor="@color/grey_90" />

      <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="@dimen/spacing_large"
        android:orientation="vertical">

        <com.search.filterhotel.widget.RangeSeekBar
          android:id="@+id/range_seek_bar"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          app:bar_color="@color/grey_20"
          app:bar_highlight_color="@color/colorPrimary"
          app:data_type="_long"
          app:left_thumb_color="@color/colorPrimary"
          app:left_thumb_color_pressed="@color/colorPrimaryDark"
          app:max_value="500"
          app:min_value="10"
          app:right_thumb_color="@color/colorPrimary"
          app:right_thumb_color_pressed="@color/colorPrimaryDark" />

        <LinearLayout
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:layout_marginTop="@dimen/spacing_medium"
          android:orientation="horizontal">

          <TextView
            android:id="@+id/price_min"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="$10"
            android:textAppearance="@style/TextAppearance.AppCompat.Subhead"
            android:textColor="@color/grey_60" />

          <View
            android:layout_width="0dp"
            android:layout_height="0dp"
            android:layout_weight="1" />

          <TextView
            android:id="@+id/price_max"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="$500"
            android:textAppearance="@style/TextAppearance.AppCompat.Subhead"
            android:textColor="@color/grey_60" />

        </LinearLayout>
      </LinearLayout>

      <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="@dimen/spacing_large"
        android:text="Destination"
        android:textAppearance="@style/TextAppearance.AppCompat.Title"
        android:textColor="@color/grey_90" />

      <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="@dimen/spacing_large"
        android:orientation="vertical">

        <EditText
          style="@style/EditText.Flat.Grey"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:background="@drawable/edit_text_round_bg_outline"
          android:drawableEnd="@drawable/ic_search_grey"
          android:drawableRight="@drawable/ic_search_grey"
          android:editable="false"
          android:minHeight="@dimen/spacing_xmlarge"
          android:paddingLeft="@dimen/spacing_large"
          android:paddingRight="@dimen/spacing_large"
          android:text="London, UK" />

      </LinearLayout>

      <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="@dimen/spacing_large"
        android:text="Guest &amp; Room"
        android:textAppearance="@style/TextAppearance.AppCompat.Title"
        android:textColor="@color/grey_90" />

      <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="@dimen/spacing_large"
        android:orientation="vertical">

        <LinearLayout
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:gravity="center_vertical"
          android:orientation="horizontal">

          <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="Guest(s)"
            android:textAppearance="@style/TextAppearance.AppCompat.Subhead"
            android:textColor="@color/grey_60" />


          <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="@dimen/spacing_xlarge"
            android:background="?attr/selectableItemBackgroundBorderless"
            android:tint="@color/colorPrimary"
            app:srcCompat="@drawable/ic_remove" />

          <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="@dimen/spacing_large"
            android:layout_marginRight="@dimen/spacing_large"
            android:gravity="center_vertical"
            android:text="1"
            android:textAppearance="@style/TextAppearance.AppCompat.Subhead"
            android:textColor="@color/grey_40"
            app:fontFamily="sans-serif-medium" />

          <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="@dimen/spacing_xlarge"
            android:background="?attr/selectableItemBackgroundBorderless"
            android:tint="@color/colorPrimary"
            app:srcCompat="@drawable/ic_add" />

        </LinearLayout>

        <LinearLayout
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:gravity="center_vertical"
          android:orientation="horizontal">

          <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="Room(s)"
            android:textAppearance="@style/TextAppearance.AppCompat.Subhead"
            android:textColor="@color/grey_60" />


          <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="@dimen/spacing_xlarge"
            android:background="?attr/selectableItemBackgroundBorderless"
            android:tint="@color/colorPrimary"
            app:srcCompat="@drawable/ic_remove" />

          <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginLeft="@dimen/spacing_large"
            android:layout_marginRight="@dimen/spacing_large"
            android:gravity="center_vertical"
            android:text="1"
            android:textAppearance="@style/TextAppearance.AppCompat.Subhead"
            android:textColor="@color/grey_40"
            app:fontFamily="sans-serif-medium" />

          <ImageButton
            android:layout_width="wrap_content"
            android:layout_height="@dimen/spacing_xlarge"
            android:background="?attr/selectableItemBackgroundBorderless"
            android:tint="@color/colorPrimary"
            app:srcCompat="@drawable/ic_add" />

        </LinearLayout>

      </LinearLayout>

      <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="@dimen/spacing_large"
        android:text="Facilities"
        android:textAppearance="@style/TextAppearance.AppCompat.Title"
        android:textColor="@color/grey_90" />

      <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="@dimen/spacing_large"
        android:orientation="vertical">

        <LinearLayout
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:gravity="center_vertical"
          android:orientation="horizontal">

          <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="Water Heater"
            android:textAppearance="@style/TextAppearance.AppCompat.Subhead"
            android:textColor="@color/grey_60" />

          <androidx.appcompat.widget.AppCompatCheckBox
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:theme="@style/Checkbox.Blue" />

        </LinearLayout>

        <LinearLayout
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:gravity="center_vertical"
          android:orientation="horizontal">

          <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="Air Conditioner"
            android:textAppearance="@style/TextAppearance.AppCompat.Subhead"
            android:textColor="@color/grey_60" />

          <androidx.appcompat.widget.AppCompatCheckBox
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:theme="@style/Checkbox.Blue" />

        </LinearLayout>

        <LinearLayout
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:gravity="center_vertical"
          android:orientation="horizontal">

          <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="Breakfast"
            android:textAppearance="@style/TextAppearance.AppCompat.Subhead"
            android:textColor="@color/grey_60" />

          <androidx.appcompat.widget.AppCompatCheckBox
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:theme="@style/Checkbox.Blue" />

        </LinearLayout>

        <LinearLayout
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:gravity="center_vertical"
          android:orientation="horizontal">

          <TextView
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="1"
            android:text="Balcony"
            android:textAppearance="@style/TextAppearance.AppCompat.Subhead"
            android:textColor="@color/grey_60" />

          <androidx.appcompat.widget.AppCompatCheckBox
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:theme="@style/Checkbox.Blue" />

        </LinearLayout>

      </LinearLayout>

    </LinearLayout>

  </androidx.core.widget.NestedScrollView>

</LinearLayout>

5. Value

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

  <style name="ThemeOverlay.AppCompat.Light" parent="Base.ThemeOverlay.AppCompat.Light"/>
  <style name="TextAppearance.AppCompat.Title" parent="Base.TextAppearance.AppCompat.Title"/>
  <style name="TextAppearance.AppCompat.Subhead" parent="Base.TextAppearance.AppCompat.Subhead"/>
  <style name="TextAppearance.AppCompat.Title" parent="Base.TextAppearance.AppCompat.Title"/>

  <color name="grey_40">#999999</color>
  <color name="grey_60">#666666</color>
  <color name="grey_80">#37474F</color>
  <color name="grey_90">#263238</color>

</resources>

M Syahrul Alfyan

Hi there! I am Founder at fyprojects and programming enthusiast from Indonesia. Fullstack Developer at startup company

Android Create Search Filter Hotel

Android Create Search Filter Hotel

1. Project Structure

2. Gradle

3. Main Activity

4. Widget - RangeSeekBar

4. Layout

5. Value

M Syahrul Alfyan

Random Post

Featured Posts

Most Read

Catagories