I am using the floating action button (fab) component from com.android.support:design:23.1.0 Library to generate my app's fabs.
But the first time I load a new activity with fab.hide() and try to make the icon visible through fab.show() after a button was clicked, there is no animation for the fab. This happens only the first time after loading a new activity. When I try that multiple times to hide and show the button, it is animated properly.
What is the issue here? It would be a charm to get it animated also right after an activity is loaded.
Java in activity:
fabSend = (FloatingActionButton) findViewById(R.id.fabSend);
fabSend.hide();
CompoundButton.OnCheckedChangeListener changeChecker = new CompoundButton.OnCheckedChangeListener() {
#Override
public void onCheckedChanged(CompoundButton buttonView, boolean isChecked) {
if (isChecked){
// FAB on
fabSend.show();
} else {
// FAB off
fabSend.hide();
}
}
};
Layout.xml
<android.support.design.widget.FloatingActionButton
android:id="#+id/fabSend"
app:borderWidth="0dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end"
android:layout_alignParentBottom="true"
android:layout_marginRight="#dimen/fab_margin"
android:layout_marginBottom="54dp"
android:src="#drawable/ic_check_white_24dp" />
I've had the same problem. In my fab xml I had visibility="gone", than I tried to show fab from the code by fab.show() - and animation was not working the first time. I've changed xml to visibility="invisible" and problem was solved.
Solved this one finally. I designed a new class to handle the reveal animation with a delay. Grab it here, initialize it and you're good to go. I found a pretty similar animation to the standard fab.show() at 50ms delay on it.
public static void showFabWithAnimation(final FloatingActionButton fab, final int delay) {
fab.setVisibility(View.INVISIBLE);
fab.setScaleX(0.0F);
fab.setScaleY(0.0F);
fab.setAlpha(0.0F);
fab.getViewTreeObserver().addOnPreDrawListener(new ViewTreeObserver.OnPreDrawListener() {
#Override
public boolean onPreDraw() {
fab.getViewTreeObserver().removeOnPreDrawListener(this);
fab.postDelayed(new Runnable() {
#Override
public void run() {
fab.show();
}
}, delay);
return true;
}
});
}
The best way to achieve that is by simply setting your Fab's scaleX and scaleY to zero in XML. It is the easiest method and it also leaves your application code clean.
<android.support.design.widget.FloatingActionButton
android:id="#+id/fab"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleX="0"
android:scaleY="0"
android:visibility="invisible"/>
According to docs:
android.support.design.widget.FloatingActionButton
public void show()
Shows the button. This method will animate the button show if the
view has already been laid out.
So, to make it animate the first time you can write you own animation to animate it when it's not currently laid out
/**
* Unlike {#link FloatingActionButton#show()} animates button even it not currently
* laid out
* #param fab fab to show
*/
#SuppressLint("NewApi")
public static void show(FloatingActionButton fab) {
if (ViewCompat.isLaidOut(fab) ||
Build.VERSION.SDK_INT < Build.VERSION_CODES.ICE_CREAM_SANDWICH) {
fab.show();
} else {
fab.animate().cancel();//cancel all animations
fab.setScaleX(0f);
fab.setScaleY(0f);
fab.setAlpha(0f);
fab.setVisibility(View.VISIBLE);
//values from support lib source code
fab.animate().setDuration(200).scaleX(1).scaleY(1).alpha(1)
.setInterpolator(new LinearOutSlowInInterpolator());
}
}
Related
I want to implement the Extended FAB button in the format mentioned on the material website (https://kstatic.googleusercontent.com/files/8f9b57829c943c97be7c4b2485cf678f041dfe7c7ef523cfb2e97f1aeee21431f83d98cc07befeeed904fabb258298e3a7ac95f9da5d3da7a4adcff658cea851)
https://material.io/components/buttons-floating-action-button#types-of-transitions
Kindly help on how to achieve the same.
You can use the Material motion and the Transition between Views.
For example define in your layout:
<androidx.coordinatorlayout.widget.CoordinatorLayout
android:id="#+id/root"
..>
<com.google.android.material.card.MaterialCardView
android:id="#+id/end_card"
android:visibility="gone" />
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="#+id/fab"
.. />
</androidx.coordinatorlayout.widget.CoordinatorLayout>
Then just define the MaterialContainerTransform:
fab.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
showEndView(fab);
}
});
with:
private void showEndView(View startView) {
// Construct a container transform transition between two views.
MaterialContainerTransform transition = new MaterialContainerTransform();
transition.setScrimColor(Color.TRANSPARENT);
transition.setInterpolator(new FastOutSlowInInterpolator());
//set the duration....
//Define the start and the end view
transition.setStartView(startView);
transition.setEndView(endCard);
transition.addTarget(startView);
// Trigger the container transform transition.
TransitionManager.beginDelayedTransition(root, transition);
if (startView != null) {
startView.setVisibility(View.INVISIBLE);
}
if (endCard != null) {
endCard.setVisibility(View.VISIBLE);
}
}
Note: it requires at least the version 1.3.0-alpha01.
I have a custom control inheriting from LinearLayout and I want to add a child control to it as soon as I know the size of this custom control.
What's the correct method to do this?
The below code is working fine:
yourView.getViewTreeObserver().addOnPreDrawListener(new ViewTreeObserver.OnPreDrawListener() {
#Override
public boolean onPreDraw() {
//yourView.getWidth()
yourView.getViewTreeObserver().removeOnPreDrawListener(this);
return true;
}
});
Hope this will help.
you have to override onFinishInflate() method inside the custom layout. That is the callback called when all views has been inflated. Use this and addd your views.
This might help:
/**
* Great workaround to get view infos after it has been drawn
*/
mCustomView.post(new Runnable() {
#Override
public void run() {
//The code you want to run
}
});
I am working on an app using geolocation and I want to set a layout VISIBLE when close to a point and GONE when too far from the point.
This is my xml :
<LinearLayout
android:visibility="gone"
android:id="#+id/slidePane"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
Then I use the ID in the activity as usual :
declare it in the class attribute :
private LinearLayout slidepane;
set it in the onCreate() method :
slidepane = (LinearLayout) findViewById(R.id.slidePane);
And then I try to update it in onLocationChanged() method as follows :
if (InterestPoint.CalculationByDistance(location, new LatLng(47.247801, -1.551883)) < 0.03) {
Toast.makeText(MainActivity.mContext, "InterestPoint close", Toast.LENGTH_SHORT).show();
slidepane.setVisibility(View.VISIBLE);
} else {
slidepane.setVisibility(View.GONE);
}
So the condition is correct since the Toast appears but the layout does not become visible, why?
Thank you.
EDIT : I am using https://github.com/umano/AndroidSlidingUpPanel and try to set the visibility of the second child (the sliding panel). I didn't see anything in the documentation about visibility. I can still access the children of the LinearLayout but not the container itself (and especialy the visibility).
Replace this:
slidepane.setVisibility(View.VISIBLE);
with this:
runOnUiThread(new Runnable() {
#Override
public void run() {
slidepane.setVisibility(View.VISIBLE);
}
});
Make sure you set the visibility of view at the time of initialization.
#Override
protected void onCreate(Bundle savedInstanceState) {
........
slidepane = (LinearLayout) findViewById(R.id.slidePane);
slidepane.setVisibility(View.GONE);
.......
//onLocationChanged() add ->
if (InterestPoint.CalculationByDistance(location, new LatLng(47.247801, -1.551883)) < 0.03) {
Toast.makeText(MainActivity.mContext, "InterestPoint close", Toast.LENGTH_SHORT).show();
slidepane.setVisibility(View.VISIBLE);
} else {
slidepane.setVisibility(View.GONE);
}
I am using a custom ProgressBar. Now while a task is going on, I am showing the progress bar, but user can still interact with the views and controls.
How do I disable the user interaction on whole view just like a ProgressDialog does , when it is visible.
Do I need to use a transparent view on top of main view and show the progress bar on that view and hide that view once a task is completed.
Or just get the id of my parentView and set it disabled ? But then I won't be able to dim the background, just like what happens when a dialog appears on the view/Activity/Fragment. Right?
I just want to know the way to disallow the user from any interaction while the progressbar is visible.
Thanks
Your question: How to disable the user interaction while ProgressBar is visible in android?
To disable the user interaction you just need to add the following code
getWindow().setFlags(WindowManager.LayoutParams.FLAG_NOT_TOUCHABLE,
WindowManager.LayoutParams.FLAG_NOT_TOUCHABLE);
To get user interaction back you just need to add the following code
getWindow().clearFlags(WindowManager.LayoutParams.FLAG_NOT_TOUCHABLE);
Here is an example:
Note:I am giving you just an example to show how to disable or retain user interaction
Add a progress bar in your xml.Something like this
<ProgressBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/progressBar"
android:visibility="gone"/>
In MainActivity when a button pressed you show the progressbar and disable the user interaction.
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
mImageView = (ImageView) findViewById(R.id.imageView);
mProgressBar = (ProgressBar) findViewById(R.id.progressBar);
mImageView.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
mProgressBar.setVisibility(View.VISIBLE);
getWindow().setFlags(WindowManager.LayoutParams.FLAG_NOT_TOUCHABLE,
WindowManager.LayoutParams.FLAG_NOT_TOUCHABLE);
}
});
}
And when user backPressed you remove the progressbar again retain the user interaction.Something like this
#Override
public void onBackPressed() {
super.onBackPressed();
mProgressBar.setVisibility(View.GONE);
getWindow().clearFlags(WindowManager.LayoutParams.FLAG_NOT_TOUCHABLE);
}
If you want to add a feature of disable and greyed out display, you need to add in your xml layout file a linear layout that fills the parent. Set its background to #B0000000 and its visibilty to GONE. Then programmatically set its visibility to VISIBLE.
Hope this help!
I have fixed this issue by adding root layout to the ProgressBar.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="match_parent"
android:layout_width="match_parent"
android:clickable="true"
android:gravity="center"
android:visibility="gone"
android:id="#+id/progress">
<ProgressBar
style="?android:attr/progressBarStyleLarge"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:indeterminate="true"
android:indeterminateTintMode="src_atop"
android:indeterminateTint="#color/primary"/>
</LinearLayout>
Made the root layout clickable
android:clickable="true"
NOTE: In my main view, I had RelativeLayout as root and have added above-mentioned code inside the root layout at the last position (last child).
Hope this helps!!
just set:
android:clickable="true"
in your xml
<ProgressBar...
Only this makes magic!
To extend (pun intended) on the accepted Answer :
When you use kotlin you can use extension functions. That way you have a quick and nice looking method for blocking and unblocking UI.
fun AppCompatActivity.blockInput() {
window.setFlags(
WindowManager.LayoutParams.FLAG_NOT_TOUCHABLE,
WindowManager.LayoutParams.FLAG_NOT_TOUCHABLE)
}
fun AppCompatActivity.unblockInput() {
window.clearFlags(WindowManager.LayoutParams.FLAG_NOT_TOUCHABLE)
}
fun AppCompatActivity.blockInputForTask(task: () -> Unit) {
blockInput()
task.invoke()
unblockInput()
}
You can use the blocking and unblocking functions in your activity. Also, you can add more functionality like showing a Toast or something.
When using it in a custom view or any other view, you can simply cast the context to activity and use the functions.
Use blockInputForTask to surround simple linear tasks and blockInputand unblockInput when they are needed in different scopes.
You can use blockInputForTask like this:
blockInputForTask {
// Your lines of code
// Can be multiple lines
}
Use document default method progressbar.setCancelable(false)
Make a dialog with transparent background. The issue with getWindow().setFlags(WindowManager.LayoutParams.FLAG_NOT_TOUCHABLE,
WindowManager.LayoutParams.FLAG_NOT_TOUCHABLE); is that when app will go in background and come back user will be able to interact with UI components, a lot more handling. So for blocking UI make a transparent dialog and if you want to set time for hide/show. Do this in a runnable thread. So the solution will be
public class TransparentDialogHelper {
private Dialog overlayDialog;
#Inject
public TransparentDialogHelper() {
}
public void showDialog(Context context) {
if (AcmaUtility.isContextFinishing(context)) {
return;
}
if (overlayDialog == null) {
overlayDialog = new Dialog(context, android.R.style.Theme_Panel);
overlayDialog.getWindow().setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_STATE_UNCHANGED);
}
overlayDialog.show();
}
public void hideDialog() {
if (overlayDialog == null || AcmaUtility.isContextFinishing(overlayDialog.getContext())) {
return;
}
overlayDialog.cancel();
}
}
-------- Timer
Handler handler = new Handler();
handler.postDelayed( () -> {
view.hideProgress();
}, 2000);
Make your parent layout as Relative Layout & add this :
<RelativeLayout ... >
<other layout elements over which prog bar will appear>
<RelativeLayout android:id="#+id/rl_progress_bar"
android:layout_width="match_parent" android:clickable="true"
android:layout_height="match_parent" >
<ProgressBar android:id="#+id/pb"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:indeterminateOnly="true"
style="#android:style/Widget.DeviceDefault.ProgressBar"
android:theme="#style/AppTheme.MyProgressBar"
/>
</RelativeLayout>
If you have floating buttons in your UI, they still grab all the focus & remain clickable when the progress bar is visible. for this use : (when your prog bar is visible & re-enable them when you make your prog bar invisible/gone)
fb.setEnabled(false);
I have a button which is called Check, I want it to be invisible and visible as I click each time on it, as If its visible and I clicked it will become invisible and verse vies !
But my code doesn't work ! any ideas ?
Button Check ;
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.settings);
Check = (Button)findViewById(R.id.checkButton);
Check.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View View) {
if (View.getVisibility() == android.view.View.VISIBLE)
View.setVisibility(android.view.View.INVISIBLE);
else if (View.getVisibility() == android.view.View.INVISIBLE)
View.setVisibility(android.view.View.VISIBLE);
}
});
In my activity its visible at the beginning and when I click on it, it become invisible, BUT when I click again it stays invisible !
Change your code to this,
Check.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
if (v.isShown())
v.setVisibility(View.INVISIBLE);
else
v.setVisibility(View.VISIBLE);
}
But i think problem is, when button goes invisible, you are not getting any click event on it. First make sure that onClick method get call when button is invisible.
An invisible button will not dispatch any interaction event. So instead of setting button's visibility to the invisible, you can set a transparent or blank background or something like that.
But i personally believe, you should change your use-case because why one will click on the invisible button.
Try This:
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:onClick="abcd" >
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:onClick="abc"
android:text="Button" />
</LinearLayout>
public void abc(View v) {
v.setVisibility(View.INVISIBLE);
}
public void abcd(View v) {
v.findViewById(R.id.button1).setVisibility(View.VISIBLE);
}
Invisible Items don't receive on-click event. So the only way you can receive a click on invisible is by receiving on some other view in place of the invisible view. The above solution wraps the button in a layout, so when button is invisible the on-click is passed on to layout, which handles the event and do accordingly. If you have a high usage of such layout you can also create a custom button with above mechanism.