Button which is visible while user holds it. Main use case is controlling audio recording state (like in Telegram, Viber, VK).

Overview

HoldingButton

Android Arsenal

Button which is visible while user holds it. Main use case is controlling audio recording state (like in Telegram, Viber, VK).

Getting started

Add library as dependency to your build.gradle.

compile 'com.dewarder:holdingbutton:0.1.3'

How to use

  1. Wrap your layout with HoldingButtonLayout. It is simple FrameLayout inside.

     <com.dewarder.holdinglibrary.HoldingButtonLayout
         android:id="@+id/input_holder"
         android:layout_width="match_parent"
         android:layout_height="wrap_content">
         
         ...
      
         <ImageView
             android:id="@+id/start_record"
             android:layout_width="48dp"
             android:layout_height="match_parent"
             android:scaleType="center"
             android:src="@drawable/ic_mic_black_24dp"/>
    
         ...
    
     </com.dewarder.holdinglibrary.HoldingButtonLayout>
    
  2. Set app:hbl_holding_view property to id of view which would be translated to HoldingButton

     <com.dewarder.holdinglibrary.HoldingButtonLayout
         android:id="@+id/input_holder"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         app:hbl_holding_view="@+id/start_record">
  3. Set app:hbl_icon property to icon (usually it is the same as in translated view) which would be appeared in HoldingButton.

     <com.dewarder.holdinglibrary.HoldingButtonLayout
         android:id="@+id/input_holder"
         android:layout_width="match_parent"
         android:layout_height="wrap_content"
         app:hbl_holding_view="@+id/start_record"
         app:hbl_icon="@drawable/ic_mic_black_24dp">
  4. Listen events

    mHoldingButtonLayout.addListener(new SimpleHoldingButtonLayoutListener() {
        @Override
        public void onOffsetChanged(float offset, boolean isCancel) {
            mSlideToCancel.setTranslationX(-mHoldingButtonLayout.getWidth() * offset);
            mSlideToCancel.setAlpha(1 - SLIDE_TO_CANCEL_ALPHA_MULTIPLIER * offset);
        }
    });
    
  5. Enjoy!

    Check full example

All XML properties

  • hbl_enabled (isButtonEnabled/setButtonEnabled)

    Set enabled or disabled state of button only.

  • hbl_direction (getDirection/setDirection)

    Set direction of sliding. Possible directions are start (from right to left) and end (from left to right).

  • hbl_cancel_offset (getCancelOffset/setCancelOffset)

    Set minimum offset for cancel action.

  • hbl_icon (setIcon)

  • hbl_cancel_icon (setCancelIcon)

  • hbl_color (getColor/setColor)

  • hbl_cancel_color (getCancelColor/CancelColor)

  • hbl_radius (getRadius/setRadius)

  • hbl_second_radius (getSecondRadius/setSecondRadius)

  • hbl_second_alpha (getSecondAlpha/setSecondAlpha)

  • hbl_offset_x (getOffsetX/setOffsetX)

  • hbl_offset_y (getOffsetY/setOffsetY)

  • hbl_animate_holding_view (setAnimateHoldingView/isAnimateHoldingView)

License

Copyright (C) 2017 Artem Glugovsky

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.
Comments
  • weird behaviour

    weird behaviour

    hi

    i wanna to have a behaviour like whatsapp with the side buttons, where the side buttons are fixed at bottom no matter the height of the input text size i have used relative layout with android:layout_alignParentBottom="true" and i have used android:layout_gravity="bottom" android:gravity="bottom" with a linear layout but that did not work screenshot_2017-03-18-05-41-03 screenshot_2017-03-18-05-46-05

    opened by hvar90 6
  • the button is released when i am recording

    the button is released when i am recording

    hi

    sometimes i have that problem, the button is released when i am recording, even when my finger press hard the button this happen sometimes not always

    my cellphone is Samsung android 7 i am using your last version 0.1.3

    opened by hvar90 3
  • with RelativeLayouts is not working

    with RelativeLayouts is not working

    i wanna use Relative layouts instead linear layout because i wanna use android:layout_alignParentBottom="true" because i wanna to have fixed the input box and the buttons at the #bottom. but when i change the linear layout with relative layout it is broken

    <com.dewarder.holdinglibrary.HoldingButtonLayout
    android:id="@+id/input_holder"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_centerHorizontal="true"
    app:hbl_cancel_icon="@drawable/ic_close_black_24dp"
    app:hbl_holding_view="@+id/start_record"
    app:hbl_icon="@drawable/ic_mic_white_24dp"
    app:hbl_radius="@dimen/activity_main_holding_button_radius"
    app:hbl_second_radius="@dimen/activity_main_holding_button_second_radius">
    <RelativeLayout
        android:id="@+id/slide_to_cancel"
        android:layout_width="match_parent"
        android:layout_height="40dp"
        android:minHeight="40dp"> 
        android:background="@android:color/white"
        android:layout_alignParentBottom="true"
        android:visibility="invisible">
        <TextView
            android:id="@+id/time"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:layout_alignParentBottom="true"
            android:text="00:00:00"
            android:textSize="25dp"
            />
        <TextView
            android:id="@+id/textView_to_cancel"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_alignParentBottom="true"
            android:text="@string/label_slide_to_cancel"/>
        <ImageView
            android:layout_width="@dimen/activity_main_slide_to_cancel_icon_size"
            android:layout_height="@dimen/activity_main_slide_to_cancel_icon_size"
            android:layout_marginEnd="@dimen/activity_main_slide_to_cancel_icon_margin_right"
            android:layout_marginRight="@dimen/activity_main_slide_to_cancel_icon_margin_right"
            android:scaleType="center"
            android:layout_toRightOf="@id/time"
            android:layout_toLeftOf="@id/textView_to_cancel"
            android:layout_alignParentBottom="true"
            android:src="@drawable/ic_keyboard_arrow_left_black_24dp"/>
    </RelativeLayout>
    <RelativeLayout
        android:id="@+id/box_emoji_input_text"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:minHeight="40dp">
    
        <ImageView
            android:id="@+id/emoji_btn"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:background="@android:color/white"
            android:layout_alignParentLeft="true"
            android:minHeight="40dp"
            android:src="@drawable/smiley"
            />
    
        <ImageView
            android:id="@+id/submit_btn"
            android:layout_alignParentBottom="true"
            android:layout_marginRight="@dimen/input_margin_right"
            android:background="@android:color/white"
            android:layout_height="wrap_content"
            android:layout_width="wrap_content"
            android:minHeight="40dp"
            android:layout_toLeftOf="@id/start_record"
            android:src="@drawable/ic_action_send_now"
            />
        <com.vanniktech.emoji.EmojiEditText
            android:id="@+id/emojicon_edit_text"
            android:layout_alignParentBottom="true"
            android:paddingBottom="@dimen/activity_main_input_padding_vertical"
            android:paddingTop="@dimen/activity_main_input_padding_vertical"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:hint="@string/typeMessage"
            android:textColorHint="#bcbcbc"
            android:inputType="textCapSentences|textAutoCorrect|textMultiLine"
            android:minHeight="40dp"
            android:background="@android:color/white"
            android:layout_toRightOf="@id/emoji_btn"
            android:layout_toLeftOf="@id/submit_btn"
            emojicon:emojiSize="26dp" />
        <ImageView
            android:id="@+id/start_record"
            android:layout_alignParentBottom="true"
            android:layout_width="@dimen/activity_main_start_record_width"
            android:layout_height="@dimen/activity_main_start_record_height"
            android:scaleType="center"
            android:background="@drawable/round_image"
            android:layout_alignParentRight="true"
            android:src="@drawable/ic_mic_white_24dp"/>
    
        <ListView
            android:id="@+id/lv"
            android:listSelector="@android:color/transparent"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_above="@id/emojicon_edit_text"
            android:layout_alignParentLeft="false"
            android:layout_alignParentTop="false"
            android:transcriptMode="normal"
            android:layout_marginBottom="5dp"
            android:paddingBottom="5dp"
            android:divider="@null"
            />
    </RelativeLayout>
    
    </com.dewarder.holdinglibrary.HoldingButtonLayout>
    
    opened by hvar90 2
  • Circle is blocked when swiping in straight line

    Circle is blocked when swiping in straight line

    Hi, I'm implementing your library in my project.

    I've got an issue when I tried to swipe the button, it's blocked when I swipe in a straight line (see gif below)

    If I go a little bit to top or bottom before swiping, everything works.

    recorder_issue

    recorder_working

    I have a lot of a view in my holding button but this issue appears even with only an Imageview inside.

    opened by Jhiertz 1
  • BUG : The specified child already has a parent. You must call removeView() on the child's parent first.

    BUG : The specified child already has a parent. You must call removeView() on the child's parent first.

    In my project, I use a swipe back library.When I swipe back I got the exception below : The specified child already has a parent. You must call removeView() on the child's parent first. I found it and fixed, I have tried in my project and there was no such exception anymore. So I hope you can merge it and create a new tag.

    opened by ParadiseHell 1
  • Update Build Tools and Gradle

    Update Build Tools and Gradle

    *Update Build Tools to 2.3.3. *Update Gradle properties to remove specified Java JDK location. This allows the project to compile if the user has set the JDK in an alternate location.

    opened by searchy2 0
  • Migrate to Maven Central

    Migrate to Maven Central

    Found some old(but gold ;) ) modules that uses your library, but ... JFrog just announced that they'll be shutting down JCenter: https://jfrog.com/blog/into-the-sunset-bintray-jcenter-gocenter-and-chartcenter/

    The deadline is 1st of February of 2022

    opened by iRYO400 1
  • border for the button recording

    border for the button recording

    is there a way to put a border color on the button ?? because sometimes the background of the activity has a similar color to button so the button is not very visible

    opened by hvar90 0
  • setOnClickListener not working

    setOnClickListener not working

    i try to use setOnClickListener on HoldingButtonLayout but it is not working

    mHoldingButtonLayout.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View view) {
                    Toast toastN = Toast.makeText(ChatActivity.this,  getString(
                            R.string.infoToRecord),
                            Toast.LENGTH_LONG);
                    toastN.setGravity(Gravity.CENTER, 0, 0);
                    toastN.show();
                }
            });
    
    opened by hvar90 1
  • Update to AndroidX

    Update to AndroidX

    Hi! It would be nice to use AndroidX libraries since this is forcing me to keep jetifier enabled in my project.

    Also, is this project still maintained? I can give a hand keeping the library up to date if you need it. Thanks and have a good day!

    opened by paolorotolo 0
Releases(0.1.3)
Owner
Artem Hluhovskyi
Making bullshit since 2015
Artem Hluhovskyi
comtomize view submit button which you use for submit operation or download operation and so on.

This is library project with a custom view that implements concept of Submit Button (https://dribbble.com/shots/1426764-Submit-Button?list=likes&offse

ZhangLei 129 Feb 5, 2021
Android button which moves in eight direction.

Moving Button Android button which moves in eight direction. Preview Sample Demo You can download demo movie file here : demo.mov It's also on Youtube

Leonardo Taehwan Kim 131 Nov 16, 2022
Android Circular Progress Button

?? Before using this library, read information below ?? This library is not more supported. If you want to add new feature or fix a bug, grab source

Dmytro Danylyk 5.6k Nov 22, 2022
Circle button widget for Android

DEPRECATED This library is deprecated and no new development is taking place. Consider using a FAB(Floating action button) instead. E.g. the Android D

Markus Hintersteiner 1.5k Nov 26, 2022
FButton - a flat button library for Android

FButton FButton is a custom Button of Android with "Flat UI" concept. FButton's design get inspiration from designmono. This library is very small and

Le Van Hoang 1.4k Nov 17, 2022
Button for android with animations for transition and error states.

Transition Button Android Preview Expand animation: Shake animation: Installation Gradle dependencies { implementation 'com.royrodriguez:transitionbu

Roy Rodriguez 133 Dec 1, 2022
[] Android floating action button

DEPRECATED Use the FloatingActionButton from the support library instead. FloatingActionButton Description Android floating action button which reacts

Oleksandr Melnykov 4k Nov 19, 2022
Floating Action Button for Android based on Material Design specification

FloatingActionButton Yet another library for drawing Material Design promoted actions. Features Support for normal 56dp and mini 40dp buttons. Customi

Zendesk 6.4k Nov 21, 2022
A cute widget of Switch Button for you to create beautiful and friendly UI.

SwitchButton To get a quick preview, you can get Demo apk in Google Play or Directly download. This project provides you a convenient way to use and c

kyleduo 4.6k Nov 18, 2022
A simple Floating Action Button that shows an anchored Navigation View

Floating Navigation View A simple Floating Action Button that shows an anchored Navigation View and was inspired by Menu Material Fixed created by Tom

André Mion 1.3k Nov 18, 2022
A download button with pretty cool animation

ArrowDownloadButton A download button with pretty cool animation, this is an implemention of https://dribbble.com/shots/2012292-Download-Animation Enj

Rongchan Liu 967 Oct 16, 2022
[] An Android library for an expandable button menu

ExpandableButtonMenu ExpandableButtonMenu is an Android library which implements an expandable button that can be used as a substitute of a fixed size

Lemon Labs 325 Nov 14, 2022
This is a Material Design loading button

This is a library project with a custom view that implements concept of Send Comment (https://dribbble.com/shots/1986254-Send-Comment-Shoppr) made by

DevinShine 295 Jul 31, 2022
A raised button that lowers down to 0dp of elevation

RaiflatButton A raised button that lowers down to 0dp of elevation. From my blog post: https://rubensousa.github.io/2016/10/raiflatbutton It behaves l

Rúben Sousa 328 Sep 11, 2022
A shopping cart button with a telescopic displacement rotation animation ...一个带伸缩位移旋转动画的购物车按钮

AnimShopButton A shopping cart button with a telescopic displacement rotation animation ... 一个仿饿了么 带伸缩位移旋转动画的购物车按钮 注意,本控件非继承自ViewGroup,而是纯自定义View,实现的仿

张旭童 1.3k Nov 10, 2022
Kotlin Expanding Floating Action button

Kotlin-Expanding-Floating-Action_button Home Screen As you can see there is only a siongle floating button with + icon Expanding Fab button When we cl

Akshay Teli 0 Nov 3, 2021
Android library providing an implementation of the Material Design Floating Action Button Speed Dial.

Android library providing an implementation of the Material Design Floating Action Button Speed Dial.

Sanyam Mehta 5 Aug 15, 2022
Floating Action Button But Moveable And Expandalbe

MeFab todo add the maven bacge here Floating Action Button but MOVEABLE and EXPA

Hussien Fahmy 4 Nov 11, 2022
➕ An efficient and beaufitul Multi Float action button library based on Twitter implemented in Jetpack Compose 🚀

Multi Float Action Button ➕ An efficient and beaufitul Multi Float action button library based on Twitter implemented in Jetpack Compose ?? Including

Geovani Amaral 8 Oct 15, 2022