Develop Reference

How to integrate an expandable Floating Action Button

I am a beginner in android development using Java,
I have tried surfing the net but to no avail.
What is name of the library which I can use to make expandable Floating Action Button like the one on the pic below.
Please help.

I was looking at some source codes. I found a best expandable FAB(Float Action Button)
Let me add those source codes.
Add it to build.gradle
implementation 'com.nambimobile.widgets:expandable-fab:1.0.2'
Add following source code to layout
<!-- This is NOT a root view, but should be a child of whatever root view you
choose (CoordinatorLayout, ConstraintLayout, etc) -->
<com.nambimobile.widgets.efab.ExpandableFabLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- The next 3 Views will only display in portrait orientation -->
<com.nambimobile.widgets.efab.Overlay
android:layout_width="match_parent"
android:layout_height="match_parent"
app:overlay_orientation="portrait"/>
<com.nambimobile.widgets.efab.ExpandableFab
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_marginBottom="#dimen/ui_margin_medium"
android:layout_marginEnd="#dimen/ui_margin_medium"
android:layout_marginRight="#dimen/ui_margin_medium"
app:efab_orientation="portrait"/>
<com.nambimobile.widgets.efab.FabOption
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:fab_orientation="portrait"
app:label_text="Portrait Option 1"
android:onClick="onClickPortraitOption1"/>
<!-- The next 3 Views will only display in landscape orientation -->
<com.nambimobile.widgets.efab.Overlay
android:layout_width="match_parent"
android:layout_height="match_parent"
app:overlay_orientation="landscape"/>
<com.nambimobile.widgets.efab.ExpandableFab
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
android:layout_marginBottom="#dimen/ui_margin_medium"
android:layout_marginEnd="#dimen/ui_margin_medium"
android:layout_marginRight="#dimen/ui_margin_medium"
app:efab_orientation="landscape"/>
<com.nambimobile.widgets.efab.FabOption
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:fab_orientation="landscape"
app:label_text="Landscape Option 1"
android:onClick="onClickLandscapeOption1"/>
</com.nambimobile.widgets.efab.ExpandableFabLayout>
Then, you can use those FAB as you use on button in Java file.
Let me add that link

ExoPlayer: Place controller under the video without overlapping the video

I have a PlayerView that takes up the top half of the Activity in portrait orientation with the bottom half of the screen showing some text.
I need to have the controller under the video without overlapping the video content (it will always be shown). By default when a user touches the video the controller appears at the bottom of the video covering the bottom part of the video. I my case I need the controller to stick under the video with no intersections with the video content.
I went through SimpleExoPlayer and PlayerView APIs but I haven't found any way to do so.
Question: How can I place the controller under the video with ExoPlayer?
Here is how the layout looks like:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.google.android.exoplayer2.ui.PlayerView
android:id="#+id/video_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"/>
<TextView
android:id="#+id/text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_below="#id/video_view"
android:scrollbars="vertical" />
</RelativeLayout>

This will push the controls down to the bottom of the screen:
<RelativeLayout 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">
<com.google.android.exoplayer2.ui.PlayerView
android:id="#+id/video_view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:use_controller="false" />
<com.google.android.exoplayer2.ui.PlayerControlView
android:id="#+id/controls"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/video_view"
app:show_timeout="0" />
</RelativeLayout>
Then in Java:
PlayerView videoView = findViewById(R.id.video_view);
PlayerControlView controls = findViewById(R.id.controls);
controls.setPlayer(videoView.getPlayer());
Edit: Modified my answer to suggestion from #RashimiGautam

Refer to the answer by #Pierre.
Also to remove controller from above PlayerView, in that case, #id/video_view by writing player.showController(false) in java file.
You can also use app:use_controller:false in the xml.
So you will the only the video without controller on top. And link it to a new controller, in that case, #id/controls at the bottom of the video.

This might give you an idea, also have you tried to override the controls?
As an example, suppose we want our playback controls to consist of only a play/pause button positioned in the center of the view. We can achieve this by creating exo_playback_control_view.xml file in the application’s res/layout directory, containing:
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageButton android:id="#id/exo_play"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_gravity="center"
android:background="#CC000000"
style="#style/ExoMediaButton.Play"/>
<ImageButton android:id="#id/exo_pause"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_gravity="center"
android:background="#CC000000"
style="#style/ExoMediaButton.Pause"/>
</FrameLayout>
Note that in the layout #id/exo_play and #id/exo_pause are standard ids defined by the ExoPlayer library. Use of standard ids is required so that child views can be identified, bound to the player and updated in an appropriate way. A full list of the standard ids for each view can be found in the Javadoc for PlaybackControlView and SimpleExoPlayerView. Use of each standard id is optional.
https://medium.com/google-exoplayer/customizing-exoplayers-ui-components-728cf55ee07a

Card view not working below Lollipop version

I am using card view but the elevation and card view properties are not working below version 5.0.
I tried to use card_view:cardUseCompatPadding="true" by searching some SO posts but this also did not work.
It should look like this
And it looks like this on 4.2.2
Here is layout:
<android.support.v7.widget.CardView
xmlns:app="http://schemas.android.com/tools"
android:id="#+id/card_view"
app:cardUseCompatPadding="true"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="05dp"
android:layout_marginTop="05dp"
card_view:cardElevation="12dp">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="60dp"
android:background="#color/bg">
<View
android:layout_width="3dp"
android:layout_height="match_parent"
android:background="#color/cardLineColor"></View>
<LinearLayout
android:id="#+id/linearLayout6"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginEnd="10dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_marginStart="10dp"
android:orientation="vertical">
<TextView
android:id="#+id/txt_id"
android:layout_width="103dp"
android:layout_height="wrap_content"
android:text="ID"
android:textColor="#color/white" />
<TextView
android:id="#+id/txt_date"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="05dp"
android:text="23/3/2015"
android:textColor="#color/textColor"
android:textSize="10sp" />
</LinearLayout>
<TextView
android:id="#+id/txt_trans_type"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/linearLayout6"
android:layout_centerHorizontal="true"
android:text="sent money"
android:textColor="#color/white"
android:textStyle="bold" />
<LinearLayout
android:id="#+id/linearLayout8"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_alignTop="#+id/linearLayout6"
android:layout_marginEnd="10dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_marginStart="10dp"
android:layout_toEndOf="#+id/txt_trans_type"
android:layout_toRightOf="#+id/txt_trans_type"
android:orientation="vertical">
<TextView
android:id="#+id/txt_balance"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="end"
android:text="$3214"
android:textAlignment="viewEnd"
android:textColor="#color/white"
android:textStyle="bold" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="end"
android:layout_marginTop="05dp"
android:text="#string/balance"
android:textAlignment="viewEnd"
android:textColor="#color/white"
android:textSize="10sp" />
</LinearLayout>
</RelativeLayout>
</android.support.v7.widget.CardView>
Edit: I created 9 patch file like this
But this is giving this error:
Error:Some file crunching failed, see logs for details
Error:Execution failed for task ':app:mergeDebugResources'.
> Error: Some file crunching failed, see logs for details
May be its height width is much? I tried with small height width but then it leaves some gap. How can I match it to all devices?

Use app:cardElevation="12dp"
instead of card_view:cardElevation="12dp"
Hope it helps.

Sadly, elevation, as you mentioned it, is not available for API 19 and below.
The solution I chose for my similar issue is to replace my cardviews by regular layouts and use 9-patch images as background to generate the shadows. It has the advantage to be very modulable, plus, unlike the elevation property, you can have more customization like shadow colors if you don't want a simple black shadow.
The only problem is that you have to design the image yourself and add it to the project. But fear not, there is some handy generators like this one that can generate it for you. Just make sure that you set a minimum size that is less than your layout to be sure it fits without deforming it. I usually generates a 10*10 pixels wide image, and shadows won't be deformed even when applied to a much larger view.
When you got your image (name should look like myimage.9.png), you simply add it to your drawables, without removing the .9.png extension, and then set it as a regular background drawable to your layout, via xml or code. And you're done !
EDIT : Did not notice you also have lighting on the top of the cardview.. What you can try if you have something like Photoshop, is to create yourself the 9-patch, by applying drop shadows for the dark one, then creating a second layer to add another drop shadow but this time set to white and with the appropriate angle to display it above. Then you save it as png and use the 9-patch generator to convert it to a .9.png image.
See the 9-patch documentation here. If you're using Android Studio, there is also a built-in generator for 9-patches.
Sadly, user interface was kinda limited for advanced displaying like shadows before Material Design stepped in with Android 5. Maybe you can add your cardviews programmatically, so you can do something like this
if (android.os.Build.VERSION.SDK_INT <= android.os.Build.VERSION_CODES.LOLLIPOP){
//Add regular layout to your views with 9 patch
} else{
//Add cardview to get desired effect
}
That way most of your users will have your desired cardviews, but it can quickly increase the amount of code you'll need if you need your element to be clickable/draggable/etc.

Horizontal scrolling in TextView by program

I've got a single lined TextView with a text in it that is too long to be displayed at once. Now I want the app to scroll horizontally smoothly to a certain position in the text when the user does certain things. So the scrolling is initiated by user actions but the user doesn't decide himself to which position the app will scroll (so I don't want to implement usual scrolling by swiping). I'd like to have a function scrollTo(int position) which accomplishes the scrolling.

Use an EditText and animate the selection property. You can easily style it to behave like a TextView if that's important, for instance:
<EditText
android:enabled="false"
android:background="#null"
android:textColor="#android:color/black"
android:id="#+id/ttt"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="very long text"
android:singleLine="true"/>
And then use property animation to scroll smoothly:
ObjectAnimator anim = ObjectAnimator.ofInt(yourEditText, "selection", from, to);
anim.setDuration(duration);
anim.start();
Note that you should not use a hard coded color for the text because on some phones the background might be different (too dark, for instance). If you have your own theme or using Holo light it you're good, but you should be aware of a possible problem.

Use this code
<HorizontalScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/horizontalScrollView1"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:singleLine="true"
android:text=" This post will help to share your urls and text values into social networks like facebook,twitter and linkedin.in facebook we have to share your urls only, but twitter and linkedin able to share both urls and text." />
</LinearLayout>

Dynamically including an XML relative layout multiple times in a parent view

I have an XML RelativeLayout snippet that I would like to include several times (from a loop) in my main View. The problem seems to be -- is there a way to avoid hard-coding the parent of the RatingBar, since each time I include the RelativeLayout snippet my elements will need to have different ids?
As far as I can tell, the recommended way is to get the layout snippet and then override the android:id for each element to be unique, and then override the android:layout_below manually for each element that has relative positioning. This seems a little kludgy -- is there any way to have these bindings get done automatically?
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="20dp"
android:id="#+id/relativeView">
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="5dp"
android:text="Label"
android:textAppearance="?android:attr/textAppearanceMedium" />
<RatingBar
android:id="#+id/ratingBar1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/textView1" />
</RelativeLayout>

you just need to change the id of the RelativeLayout
like
int BASEID=200;
View v = mLayoutInflator.inflate(R.layout.myRelativeLayout, null);
for (int i;i<10;i++){
v.findViewById(R.id.relativeView).setId(i+BASEID);
}
mRootView.addView(v,...);
then when you need to get the RatingBar for suppose the 4th RelativeLayout you added you can call
RatingBar mRatingBar = (RatingBar)mRootView.findViewById(BASEID+3).findViewById(R.id.ratingBar1);