Change image Floating Action Button Android - android

I used this library https://github.com/futuresimple/android-floating-action-button. How can I change the image of the main button? I want to change the button image right after selecting one of the smaller buttons.

From https://developer.android.com/reference/android/support/design/widget/FloatingActionButton.html
As this class descends from ImageView, you can control the icon which
is displayed via setImageDrawable(Drawable).
Or you can use setImageResource():
fab.setImageResource(R.drawable.ic_shopping_cart_white);

you can use this in your .XML :
android:src="#drawable/icon" // change backgroung icon
app:backgroundTint="#color/icons" // change background color
use this in code:
mFloatingActionButton.setImageResource(R.drawable/icon2);

FloatingActionButton fab = (FloatingActionButton) findViewById(R.id.fab_btn);
// State 1 -on
fab.setImageDrawable(ContextCompat.getDrawable(getActivity(), R.drawable.fab_on));
// State 2 - off
fab.setImageDrawable(ContextCompat.getDrawable(getActivity(), R.drawable.fab_off));

In Kotlin, this will be:
#RequiresApi(Build.VERSION_CODES.LOLLIPOP)
private fun pauseTimer() {
floatingActionButton.setImageDrawable(getDrawable(R.drawable.ic_baseline_play_arrow))

I faced same issue recently, I tried with following option
fab:fab_icon="#drawable/icon"
and
android:src="#drawable/icon" // change backgroung icon
even tried programmatically
fab_menu_btn.setImageResource();
Nothing worked.
Solution: In app's build.gradle file replace
compile 'com.getbase:floatingactionbutton:1.10.0'
to
compile 'com.github.toanvc:floatingactionmenu:0.8.9'
In .xml file Use:
<toan.android.floatingactionmenu.FloatingActionsMenu
</toan.android.floatingactionmenu.FloatingActionsMenu>
In activity File:
floatingActionsMenu.setIcon(getResources().getDrawable(R.mipmap.icon));

In the Material design version:
build.gradle (app)
defaultConfig {
vectorDrawables.useSupportLibrary = true // For srcCompat
}
dependencies {
implementation 'com.google.android.material:material:<version>'
}
XML (for set icon)
app:srcCompat="#drawable/ic_google"
app:tint="#color/colorGoogle"
More documentation: https://material.io/develop/android/components/floating-action-button/

I had the same problem and I managed to create my own solution. Maybe some else founds it also useful. I have posted the complete answer to another question (How to set an icon to getbase FloatingActionsMenu) but this part posted here is relevant to the question in dynamically changing the main menu button picture/image when one of the sub buttons is chosen. In this case, you need o combine the answer from the "linked question" and the answer below.
In order to change the icon on the menu button when you choose a floatingActionButton it can be implemented like this:
Create menu button in xml file, create floating button(s) on .java file (programmatically) set menu button (color button, color pressed button and image). Then simply add all buttons to the menu button. You can also deactivate the animation of the menu button by simply commenting out the code in FloatingActionsMenu class.
Then every time that you create a button, sample:
final FloatingActionButton actionA = new FloatingActionButton(getBaseContext());
actionA.setTitle("Familie");
actionA.setIcon(R.drawable.world_map);
actionA.setSize(FloatingActionButton.SIZE_MINI);
actionA.setColorNormalResId(R.color.red);
actionA.setColorPressedResId(R.color.black_semi_transparent);
actionA.setOnClickListener(new OnClickListener() {
#Override
public void onClick(View v) {
menuMultipleActions.setMenuButton(R.drawable.icon, R.color.red_transparent, R.color.black_semi_transparent);
Toast.makeText(MainMapView.this, "Action Description", Toast.LENGTH_SHORT).show();
((FloatingActionsMenu) findViewById(R.id.multiple_actions)).collapse();
return;
}
});
See the answer posted on the link on how to configure the classes and define the menu button and floating button(s).
So the important part to notice here is:
menuMultipleActions.setMenuButton(R.drawable.icon, R.color.red_transparent, R.color.black_semi_transparent);
This method you need to add in the FloatingActionsMenu class. Simply you call the method after on every floatingActionButton you want to update the image.
More information you can find on the link that I have posted. So when you click one of the floatingActionButton(s).
For the moment the color on the menu button is not updating correctly but I am working on it if I find a solution I will update the answer here as well. Hope this helps, happy coding.

Unfortunately with this library you can't change the icon from the menu (see issues from this library from more info)
That is why I dropped this library to use a way more flexible one! It is originally a fork but it is now more advanced.
Here is the link

Add the property
fab:fab_icon="#drawable/fab_expand"
in the xml where you initialized the floating action menu.

Related

How to get accessibility focused current item Android

I am working with android accessibility. For my requirement i have to get accessibility currently focussed item. i.e. Currently highlighted item in screen.
Something like
if(myButton.isHighlighted)
{
}
I tried all below but nothing workout for me...
if(mybutton.isFocused())
if(mybutton.isSelected())
if(mybutton.isAccessibilityFocused())
if(mybutton.isEnabled())
if(mybutton.isActivated())
if(mybutton.isFocusable())
if(mybutton.isPressed())
You can call isAccessibilityFocused
try these attributes on Button in the layout
android:focusable="true"
android:focusableInTouchMode="true"
and must call inside java file:
mybutton.requestFocus();
After this check, if button is focused with accessibility.

android change image button background

I cannot seem to change the background image of my image button. Heres the code i'm currently trying to use:
ImageButton imgButton = (ImageButton) findViewById(R.id.showSportsButton);
imgButton.setBackgroundResource(R.drawable.tab2_selected);
However this seem to be placing the new image on top of the old image leaving me with 2 images overlapping each other.
Does anyone know why this is??
For solving this question you should implement
imgButton.setImageResource(R.drawable. tab2_selected);
Use this method:
imgButon.setBackground(getActivity().getDrawable(R.drawable.your_icon));
in xml file, <Button> write: android:backgroud="#drawable/your_file"
Make sure you are on same activity. If you are changing background of different activity first create the constructor then use object to change button.
Activity obj= new activity();
obj.imgButton.setBackgroundResource(R.drawable.tab2_selected);
and also check that oncreate() method has void return type if you are using only findviewbyid.

How do I create the semi-transparent grey tutorial overlay in Android?

You know when you run an Android device for the first time (something you see a lot if you use the emulator) that there's a helpful little tutorial about how to use the launcher and add widgets, etc. I'm trying to find an example of this on Google, but I can't. I'm hoping you know what I mean. It's the one with the blue "okay" buttons at each step.
Anyway, I want to create one for my app, but I'm not sure which is the best way to go about doing it.
Do I create a Fragment that I can make semi-transparent on top of my regular activity and have it show up on only the first run?
Do I make a semi-transparent .png for each section of the tutorial and overlay it over the regular launcher activity on the first run?
If I do the latter, how can I adjust for all the various screen sizes? I could just render the image in Photoshop to various dimensions, but that won't cover all of them. If I go the fragment route, I can just say "match_parent" and not worry about it. But then I have to figure out how Fragments work, and they confuse the hell out of me.
I think this open-source library is exactly what you're looking for:
Showcase View
You can grab the source code and setup instructions from GitHub.
Use a hexadecimal color code, which consists of two digits for alpha and six for the color itself, like this:
android:background="#22FFFFFF"
It'll make it semi-transparent.
android:background="#c0000000" for more darkness
Edited
Generally hexadecimak color code structure is like '#FFFF'
For attaining transparency add two digits after '#' to any color code.
Eg : #110000, #220000, #330000.
The greater those two digits, the lesser transparency.
You can try something like this
<LinearLayout ... >
<!-- your Normal layout goes here -->
<RelativeLayout android:id="#+id/tutorialView" android:background="#D0000000"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView android:src="#drawable/hint_menu" android:layout_alignParentLeft="true"
android:layout_centerVertical="true" android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</RelativeLayout>
</LinearLayout>
And in your onCreate method
View tutorialView = findViewById(R.id.tutorialView);
boolean tutorialShown = PreferenceManager.getDefaultSharedPreferences(MainActivity.this).getBoolean(Constants.PREF_KEY_TUT_MAIN, false);
if (!tutorialShown) {
tutorialView.setVisibility(View.VISIBLE);
} else {
tutorialView.setVisibility(View.GONE);
}
tutorialView.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
v.setVisibility(View.GONE);
PreferenceManager.getDefaultSharedPreferences(MainActivity.this).edit().putBoolean(Constants.PREF_KEY_TUT_MAIN, true).commit();
}
});
There is an award-winning library for this called "FancyShowcaseView":
https://github.com/faruktoptas/FancyShowCaseView
Add to your project like this:
In the top-level build.gradle (not the module level):
allprojects {
repositories {
...
maven { url "https://jitpack.io" }
}
}
In the module-level (app) build.gradle
dependencies {
compile 'com.github.faruktoptas:FancyShowCaseView:1.0.0'
}
Then you can call:
new FancyShowCaseView.Builder(this)
.focusOn(view)
.title("Focus on View")
.build()
.show();
You don't need to use Photoshop. You can Use for example a LinearLayout with android:background="#50134BE8". This will make it transparent blue. You can place the layout on top of everything and hide it when the user is done. You can use any background color, but to make it transparent, place a number from 01 to FE, after the "#" symbol to change its transparency. Set the width and the height to fill_parent to occupy the whole area. Place this view directly in the main layout. Hope this helps.

Change android softkeyboard sample designs, button and background images

I'm building a custom keyboard by modifying the android softkeyboard sample from the SDK. I want to change the images of the buttons and the backgrounds but I can't figure out where those values are stored. Where are they stored or how can i change the image or simply color?
in onClick method you need to change the Button's image, this way..
public void onClick(View v) {
if(v==buttonName){
buttonName.setBackgroundResource(R.drawable.imageName);
}
}
The keyboard background color can be changed in input.xml using android:background
You need to edit the file res/xml/qwerty.xml.
You can check the documentation for Keyboard and the Keys. The last one defines what is shown on the keys (does not look like you can change the background though).
You need to edit the file
res/layout/input.xml
A sample input.xml could look like this.
<com.example.keyboard.LatinKeyboardView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/keyboard"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#drawable/keyboardbackground"
android:keyBackground="#drawable/samplekeybackground"
android:keyPreviewLayout="#layout/input_key_preview"
android:keyTextcolor="#android:color/black"/>
there are few more attributes that can be found in the KeyboardView documentation.

Android: Where to find the RadioButton Drawable?

Ok, I am trying to create a custom view called CheckedRelativeLayout.
It's purpose is the same as a CheckedTextView, to be able to use it in a list of items you want selected or in a Spinner.
It's all working fine now, I extended RelativeLayout and implemented Checkable interface.
However, I am stuck on a quite simple problem: Where can I find the Drawable that CheckedTextView and RadioButton use?
I looked at the sourcecode of both, and they seem to use com.android.internal.R. Well... that's internal stuff. So I can't access it.
Any way to get these Drawables or solve the problem somehow?
look under SDK folder /platforms/android-2.0/data/res/
you can access them by either android.R.drawable ( if public ) or need to copy them as drawable to your project
For sake of completeness:
Here some code pieces that show how you I got it working with above accepted answer.
//Image Setup (Once when creating this view)
ImageView indicator = (ImageView) findViewById(R.id.RadioStatusImage);
indicator.setImageDrawable(getResources().getDrawable(android.R.drawable.btn_radio));
//State Change (In some other method)
android.R.attr.state_checked
if (isChecked)
{
indicator.setImageState(android.R.attr.state_checked, false);
}
else
{
indicator.setImageState(View.ENABLED_STATE_SET, false);
}
invalidate();
To use the new default animated radio button drawable, the correct answer is in the comment of #sidon:
?android:attr/listChoiceIndicatorSingle
Using this in the custom position relative to text:
<RadioButton
...
android:gravity="center_horizontal|bottom"
android:drawableTop="?android:attr/listChoiceIndicatorSingle"
android:button="#null"
/>

Categories

Resources