Selected cardview no foreground - java

I need to do what google does with notes like this.
This happens when I select a note and not just when I press one, even if my finger isn't on the note, the card view is selected and grey.
I tried with a custom foreground but without results.
I am not sure it can be done with foreground.

If I understand you correctly, you want to implement color change and add stroke on long click?
Than you can use one trick:
set your card layout like so:
<android.support.v7.widget.CardView
android:id="#+id/card"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
...>
<LinearLayout
android:id="#+id/layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
...>
...
</LinearLayout>
</android.support.v7.widget.CardView>
Set LinearLayout background color
<android.support.v7.widget.CardView
android:id="#+id/card"
xmlns:card_view="http://schemas.android.com/apk/res-auto">
<LinearLayout
android:id="#+id/layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/your_color"
...>
...
</LinearLayout>
</android.support.v7.widget.CardView>
Than change card and layout background color at runtime, layout margins to reveal card beneath
layout.setOnLongClickListener(new View.OnLongClickListener() {
public boolean onLongClick(View l) {
card.setCardBackgroundColor(Color.parseColor("#939393")); //darker gray
layout.setBackgroundColor(Color.parseColor("#d4d4d4")) //gray
// use this to define margins in dp, not px
int dp8 = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 8, getResources().getDisplayMetrics());
// get layout's parent (card is parent of layout)
CardView.LayoutParams params = (CardView.LayoutParams) card.getLayoutParams();
// set margins in dp
params.setMargins(dp8, dp8, dp8, dp8);
// apply them to your layout
layout.setLayoutParams(params);
}
});
I haven't tested this code yet, but I think it should do the trick.

Tried toggling the background of the cardview via code with a white gray color depending on the state that you would prefer. Ie if it's selected etc?

Use duplicateParentState on note.
The childView will get parentView's state.
When you press parentView,the childView will get the pressed state.
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="123"
android:background="#drawable/bg_txt"
android:duplicateParentState="true"
android:textSize="15sp" />
</FrameLayout >
Add
<color name="color_1">#4b14b1</color>
<color name="color_0">#ffffff</color>
in colors.xml.
Add bg_txt.xml in drawable folder.
bg_txt.xml
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_selected="true" android:drawable="#color/color_1"></item>
<item android:state_pressed="true" android:drawable="#color/color_1"></item>
<item android:drawable="#color/color_0"></item>
</selector>

Related

Change between images using Fade In/Out animations

I am trying to change between images using fade in/out and I am having a difficult time.
This is what I have for the code
public void fade(View view)
{
ImageView loveLive = findViewById(R.id.lovelive);
ImageView rikoCheer = findViewById(R.id.rikoCheer);
loveLive.animate().alpha(0f).setDuration(2000);
rikoCheer.animate().alpha(1f).setDuration(2000);
}
public void fade2(View view)
{
ImageView rikoCheer = findViewById(R.id.rikoCheer);
ImageView loveLive = findViewById(R.id.lovelive);
rikoCheer.animate().alpha(0f).setDuration(2000);
loveLive.animate().alpha(1f).setDuration(2000);
}
Here is my xml file
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<ImageView
android:id="#+id/lovelive"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:onClick="fade"
app:srcCompat="#drawable/lovelive"
tools:layout_editor_absoluteX="50dp"
tools:layout_editor_absoluteY="-69dp" />
<ImageView
android:id="#+id/rikoCheer"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:alpha="0"
android:onClick="fade"
app:srcCompat="#drawable/rikocheer"
tools:layout_editor_absoluteX="0dp"
tools:layout_editor_absoluteY="0dp" />
</androidx.constraintlayout.widget.ConstraintLayout>
so my goal for this is to fade in and fade out between images
What's going wrong exactly? If nothing's showing up it might be that you don't have any layout constraints set up for your images (the tools: stuff only affects the layout editor, like fake data for testing, it doesn't apply when you run the app)
There's something called a TransitionDrawable you might want to use, you'd basically create a new Drawable XML file and put this in it
<?xml version="1.0" encoding="utf-8"?>
<transition xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/lovelive" />
<item android:drawable="#drawable/rikocheer" />
</transition>
and then you can just use that in an ImageView or whatever.
In your code you'd go
myImage = (TransitionDrawable) findViewById<ImageView>(R.id.thatImageView).getDrawable()
and then you can call myImage.startTransition(duration) to go from image 1 to image 2, or myImage.reverseTransition(duration) to go back to the first image. You can switch immediately with resetTransition() for image 1 or startTransition(0) to go straight to image 2
You also might want to use setCrossfadeEnabled() on the TransitionDrawable - when it's false the first image is always opaque, so the second is drawn on top of it like an overlay. If it's set to true you get one fading out while the other fades in - depends what you want!

How to change iconTint of a specific item in BottomNavigationView

I am trying to change the iconTint of the favorites menuItem in the bottomNavigationView.
To achieve so, I've tried the following:
Creating a selector with colors
Creating a selector with drawables
Programatically setting icon drawable
programatically setting iconItemTint of bottomNavigationView to null
Using colored icon drawables, instead of iconItemTint
Setting the icon of favorites to the drawable selector
Setting the background of favorites to the desired color
Setting iconTint of favorites to desired color
None of the above solutions worked for me. Then I figured that it might be because I'm using com.google.android.material.bottomnavigation.BottomNavigationView instead of android.support.design.widget.BottomNavigationView
My bottomNavigationView
<com.google.android.material.bottomnavigation.BottomNavigationView
android:id="#+id/bottom_navigation"
app:labelVisibilityMode="labeled"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="bottom|end"
app:itemTextColor="#232323"
app:menu="#menu/bottom_nav_menu" />
My bottom_nav_menu
<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto">
...
<item
android:title="Favorites"
android:id="#+id/btn_favorites"
android:enabled="true"
android:background="#color/red_heart"
android:icon="#drawable/ic_favorite_red"
app:showAsAction="ifRoom" />
...
Here is a screenshot of my app:
The selected color is blue for all menuItems. I want the favorites to have the color #ff4444 (pale red) when selected.
I wasted a lot of time searching the correct answer to "How to change color of one specific icon of Bottom Navigation View" and I resolved this by myself. Here is the example:
val view = viewBinding.bottomNavigationView.menuView as NavigationBarMenuView
val itemToChange = view.findViewById<NavigationBarItemView>(R.id."item_to_change_id")
itemToChange.setIconTintList(
ColorStateList.valueOf(
ContextCompat.getColor(requireContext,R.color."color you need")
)
)
I didn't try this with android.support.design.widget.BottomNavigationView, but with com.google.android.material.bottomnavigation.BottomNavigationView it works correctly :)
<android.support.design.widget.BottomNavigationView
android:id="#+id/navigation"
android:layout_width="match_parent"
android:layout_height="56dp"
android:layout_gravity="bottom"
android:layout_marginBottom="0dp"
app:itemTextColor="#color/bootom_text_color"
app:itemIconTint="#color/bootom_text_color"
android:background="#color/bottom_color"
app:elevation="0dp"
app:layout_constraintBottom_toBottomOf="parent"
app:menu="#menu/bottom_navigation" />
create colour.xml in values
<?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_checked="true" android:color="#FFFF00" />
<item android:color="#color/white" /> </selector>

Make Spinner dropdown to match screen width

I'd like my Spinner dropdown items to fill the entire screen width even tho my 'title' does not. Problem is the dropdown menu width seems to be limited the Spinner's title width.
My goal is to make it fill the entire screen width, with no spacing left or right, right below the action bar. A similar one to what I'm trying to do would be Instagram's menu to change profile.
I looked to similar questions but didn't find a solution that worked here. Also tried to create a custom adapter and making sure its views had match_parent attribute on their width. But didn't work either.
main.java (only relevant part of the code for legibility)
mMyListsSpinner = (Spinner) findViewById(R.id.spinner_mylists);
ArrayAdapter<String> snipperAdapter = new ArrayAdapter<String>(
FamilistActivity.this, R.layout.layout_spinner_title, dummyLists);
snipperAdapter.setDropDownViewResource(R.layout.layout_spinner_dropdown);
mMyListsSpinner.setAdapter(snipperAdapter);
mMyListsSpinner.setOnItemSelectedListener(this);
layout_spinner_title.xml
<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/spinner_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="18sp"
android:textColor="#color/color_white_bright"
android:maxLines="1"
style="#style/OverflowMenu"
android:text="this is my list"/>
layout_spinner_dropdown.xml
<?xml version="1.0" encoding="utf-8"?>
<CheckedTextView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/layout_spinner_dropdown"
android:layout_width="match_parent"
android:layout_height="#dimen/toolbar_actionbar_height"
android:maxLines="1"
android:textSize="18sp"
android:textColor="#color/color_green_dark"
android:background="#color/color_white_bright"/>
styles.xml (only the relevant part)
<style name="OverflowMenu" parent="Widget.AppCompat.PopupMenu.Overflow">
<item name="overlapAnchor">false</item>
<item name="android:dropDownVerticalOffset">16dp</item>
<item name="android:dropDownHorizontalOffset">-15dp</item>
</style>
my toolbar:
toolbar.xml
<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/bar_appbar"
android:layout_width="match_parent"
android:layout_height="#dimen/toolbar_actionbar_height"
app:layout_collapseMode="pin"
android:background="#color/color_green_bright">
<Spinner
android:id="#+id/spinner_mylists"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:spinnerMode="dropdown"
android:dropDownWidth="match_parent"
style="#style/OverflowMenu"/>
By looking into AppCompatSpinner.java and running the debugger I saw in this line in computeContentWidth()
else if (mDropDownWidth == MATCH_PARENT) {
setContentWidth(spinnerWidth - spinnerPaddingLeft - spinnerPaddingRight);
}
that SpinnerPaddingRight has a value that is not 0. I solved it by setting
android:paddingEnd="0dp"
in the Spinner view.

Left margin between icons and NavigationView

I have to add a left margin between the icons and the NavigationView, in arrow in the image bellow:
I know that according to google specs, this margin must have 16dp but I need to change it. I have tried:
<dimen tools:override="true" name="design_navigation_icon_padding">64dp</dimen>
<dimen tools:override="true" name="design_navigation_separator_vertical_padding">20dp</dimen>
But still not working. Any ideas?
The xml layout of that item is design_navigation_item.xml
<android.support.design.internal.NavigationMenuItemView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="?attr/listPreferredItemHeightSmall"
android:paddingLeft="?attr/listPreferredItemPaddingLeft"
android:paddingRight="?attr/listPreferredItemPaddingRight"
android:foreground="?attr/selectableItemBackground"
android:focusable="true"/>
As you can see, paddings that are applied are taken from the activity's theme - listPreferredItemPaddingLeft and listPreferredItemPaddingRight. Thus, you have to apply your custom theme to NavigationView overriding those attributes with necessary values.
In styles.xml:
<style name="MyNavigationViewItemStyle" parent="AppTheme">
<item name="listPreferredItemPaddingLeft">0dp</item>
<item name="listPreferredItemPaddingRight">0dp</item>
</style>
We want to change only those two attributes from activity's theme, thus we are extending the theme, that is applied to the activity.
In layout xml:
<android.support.design.widget.NavigationView
...
app:theme="#style/MyNavigationViewItemStyle"/>
Result
For my case I added one line to xml: app:itemHorizontalPadding="#dimen/horizontal_padding_on_nav_drawer"
<android.support.design.widget.NavigationView
android:id="#+id/navigation_view"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
android:background="#android:color/white"
android:clipToPadding="false"
android:paddingBottom="#dimen/space48"
app:headerLayout="#layout/layout_nav_header"
app:insetForeground="#color/black"
app:itemBackground="#drawable/background_selected_menu"
**app:itemHorizontalPadding="#dimen/horizontal_padding_on_nav_drawer"**
app:menu="#menu/drawer">

How do I mimick the Lollipop (Material Design) button animation?

There's a style called Widget.Material.Button that has an animation effect that I really like (it makes a "splash" around your click), and I want to be able to reuse it in my code.
I'm trying to make it have a transparent background color, since it is gray by default which does not look good when applied to my ViewGroup objects.
Is there an easy way to keep the animation, but get rid of the background color?
I already tried setting the property android:background="#android:color/transparent", but that causes the animation to completely stop working.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
style="#android:style/Widget.Material.Button"
tools:targetApi="lollipop">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello, world!"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="This is just another line of text."/>
</LinearLayout>
As mentioned in this blog under 'Clickable Views', you can use android:background="?attr/selectableItemBackground:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="?attr/selectableItemBackground">
...
</LinearLayout>
Sorry for giving the wrong bit initially. The problem as looking a bit deeper is the background color is defined already as part of whatever you are using for your MaterialTheme extension for color highlights. Ironically, they have sources from transparent elsewhere but not here ?
What you want to so is make TWO new xml files to define your properties
In vales-v21/styles.xml you can redefine these any way you like or eliminate values you don't want to override
IF YOU JUST WANT THE RIPPLE, USE THE DRAWABLE CODE DEFINED AT THE BOTTOM
<style name="MyMaterialButton" parent=android:Widget.Material.Button>
<item name="background">#drawable/material_background_ripple</item>
<item name="textAppearance">?attr/textAppearanceButton</item>
<item name="minHeight">48dip</item>
<item name="minWidth">88dip</item>
<item name="stateListAnimator">#anim/button_state_list_anim_material</item>
<item name="focusable">true</item>
<item name="clickable">true</item>
<item name="gravity">center_vertical|center_horizontal</item>
</style>
Then your button background style
/drawable-v21/material_background_ripple.xml
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="#android:color/PICK_RIPPLE_COLOR_HERE">
<item android:drawable="#drawable/btn_default_mtrl_shape" />
</ripple>
Redacted:
Have you tried
customView.getWindow().setBackgroundDrawableResource(R.color.transparent);
?

Categories