Android: xml selector for button - java

I'm trying to use an xml selector to change the image of imagebuttons when they are pressed but I've been faceing a few problems. First of all, the images appear with different dimensions on the screen, and secondly the button changes color only when clicked, but not when it is active.
This is the xml of the layout with the imagebuttons:
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:id="#+id/coupon_filter_btns"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:background="#a7a7a7"
android:weightSum="7"
>
<ImageButton
android:id="#+id/filter_greece"
android:layout_width="0dp"
android:layout_height="40dp"
android:scaleType="fitCenter"
android:src="#drawable/greece"
android:layout_weight="1"
android:background="#drawable/greece"
android:paddingTop="4dp"
android:paddingBottom="4dp"
/>
<ImageButton/>
<ImageButton/>
</LinearLayout>
Below is the selector called greece.xml:
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#drawable/greece_active" android:state_selected="true"></item>
<item android:drawable="#drawable/greece_active" android:state_focused="true"></item>
<item android:drawable="#drawable/greece_active" android:state_pressed="true"></item>
<item android:drawable="#drawable/filter_white_greece"></item>
</selector>
And this is the java code where the button is used:
ImageView filterGreece = (ImageView) kati.findViewById(R.id.filter_greece);
filterGreece.setBackgroundResource(R.drawable.greece);
filterGreece.setOnClickListener(new ViewListeners(this.getContext()).new OneFragmentFilters(OneFragment.this) ) ;

Ok first there Erro in your XML
you Just set drawable as background Not Src
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:id="#+id/coupon_filter_btns"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:background="#a7a7a7"
android:weightSum="7"
>
<ImageButton
android:id="#+id/filter_greece"
android:layout_width="0dp"
android:layout_height="40dp"
android:scaleType="fitCenter"
android:layout_weight="1"
android:background="#drawable/greece"
android:paddingTop="4dp"
android:paddingBottom="4dp"
/>
</LinearLayout>
second selector will work fine without
filterGreece.setBackgroundResource(R.drawable.greece);
so remove this Line

Related

editText icons won't color when that field is pressed

I am trying to create a login activity with two fields - email and password. This is my activity XML where I implemented the 2 edit text labels. I want, when pressed, the icon from the edit text to change its color, but it seems that what I did doesn't work properly.
<EditText
android:id="#+id/etLoginEmail"
android:layout_width="375dp"
android:layout_height="60dp"
android:layout_marginStart="20dp"
android:layout_marginTop="70dp"
android:drawableStart="#drawable/custom_email_icon"
android:drawablePadding="10dp"
android:background="#drawable/custom_input"
android:paddingStart="12dp"
android:paddingEnd="12dp"
android:hint="Email"
android:inputType="text"
android:textSize="24sp"
android:fontFamily="#font/fredokamedium"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/logo" />
<EditText
android:id="#+id/etLoginPass"
android:layout_width="375dp"
android:layout_height="60dp"
android:layout_marginStart="20dp"
android:layout_marginTop="40dp"
android:drawableStart="#drawable/custom_lock_icon"
android:drawablePadding="10dp"
android:background="#drawable/custom_input"
android:paddingStart="12dp"
android:paddingEnd="12dp"
android:hint="Password"
android:inputType="textPassword"
android:textSize="24sp"
android:fontFamily="#font/fredokamedium"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#+id/etLoginEmail" />
This is what i did for the custom icon xml files
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_focused="true"
android:drawable="#drawable/ic_lock_focused"/>
<item android:state_focused="false"
android:drawable="#drawable/ic_lock"/>
</selector>
Does anyone know what the issue may be?
EditText-selected - shows border, but icon doesnt change color

ConstraintLayout with Button State Pressed

I have a button that is complex but can be done easily with Constrain Layout. However I would like button state change feature to change the background color when pressed. I tried with state press or selected, but it doesn't work. What's the best way to solve this?
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_pressed="true" android:drawable="#drawable/button_pressed"/>
<item android:state_pressed="false" android:drawable="#drawable/button_grayout" />
</selector>
ConstraintLayout as a Button
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginEnd="16dp"
android:background="#drawable/button_press"
android:id="#+id/background_create"
android:padding="8dp">
<TextView
android:id="#+id/txt_display"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Big Text"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#ffffff"
android:textStyle="bold"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Mini Text"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textColor="#D5D5D5"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/txt_display_alert1" />
</androidx.constraintlayout.widget.ConstraintLayout>
You can try to add onClick event to the ConstraintLayout like following:
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginEnd="16dp"
android:background="#drawable/button_press"
android:id="#+id/background_create"
android:padding="8dp"
android:onClick="onClick"
>
....
add onClick() in the activity or fragment
As you apply the drawable to the ConstraintLayout, not to a Button; then you have to make it clickable and focusable in order to have the press effect of the Button:
So, you need to add:
android:clickable="true"
android:focusable="true"
Like:
<androidx.constraintlayout.widget.ConstraintLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="8dp"
android:layout_marginEnd="16dp"
android:background="#drawable/button_press"
android:id="#+id/background_create"
android:clickable="true"
android:focusable="true"
android:padding="8dp">

I am trying to create custom modal bottom sheet with line on the top, how can I achieve that?

I tried to change the style, but apart from the round corners nothing worked.Here example of bottom sheet https://i.stack.imgur.com/6O92g.jpg.
Can anyone helps? Here what I tried and I got shadow line after I opened modal https://i.stack.imgur.com/uoHNA.jpg
I am trying to create custom modal bottom sheet with line on the top, how can I achieve that?
MainAct
class MainActivity : AppCompatActivity() {
lateinit var btnShowBottomSheet: Button
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
btnShowBottomSheet = findViewById(R.id.idBtnShowBottomSheet);
btnShowBottomSheet.setOnClickListener {
val dialog = BottomSheetDialog(this)
val view = layoutInflater.inflate(R.layout.bottom_sheet_dialog, null)
val btnClose = view.findViewById<Button>(R.id.idBtnDismiss)
btnClose.setOnClickListener {
dialog.dismiss()
}
dialog.setContentView(view)
dialog.show()
}
}
}
Bottom_sheet_xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/rounded_top_corners"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="20dp"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_rectangle"
android:layout_centerInParent="true"
/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
>
<!--image view for displaying course image-->
<ImageView
android:id="#+id/idIVCourse"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_margin="10dp"
android:src="#drawable/ic_launcher_background" />
<!--text view for displaying course name-->
<TextView
android:id="#+id/idTVCourseName"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:layout_toEndOf="#id/idIVCourse"
android:layout_toRightOf="#id/idIVCourse"
android:text="DSA Self Paced Course"
android:textColor="#color/black"
android:textSize="18sp"
android:textStyle="bold" />
<!--text view for displaying course tracks-->
<TextView
android:id="#+id/idTVCourseTracks"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/idTVCourseName"
android:layout_marginTop="10dp"
android:layout_toEndOf="#id/idIVCourse"
android:layout_toRightOf="#id/idIVCourse"
android:text="Course Tracks : 30"
android:textColor="#color/black"
android:textSize="15sp" />
<!--text view for displaying course duration-->
<TextView
android:id="#+id/idTVCourseDuration"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/idTVCourseTracks"
android:layout_marginTop="10dp"
android:layout_toEndOf="#id/idIVCourse"
android:layout_toRightOf="#id/idIVCourse"
android:text="Course Duration : 4 Months"
android:textColor="#color/black"
android:textSize="15sp" />
<!--button for dismissing our dialog-->
<Button
android:id="#+id/idBtnDismiss"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/idIVCourse"
android:layout_margin="10dp"
android:text="Dismiss dialog"
android:textAllCaps="false" />
</RelativeLayout>
</RelativeLayout>
Based on the xml and code you have posted you have to make the below changes:
1.Change the xml android:background structure to be like below. The drawable which has rounded corners must be set to the 2nd child of RelativeLayout instead of parent and all other RelativeLayouts must have android:background="#android:color/transparent":
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#android:color/transparent">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="20dp"
android:background="#android:color/transparent">
<ImageView
android:layout_width="80dp"
android:layout_height="10dp"
android:background="#color/white"
android:layout_centerInParent="true" />
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:background="#drawable/rounded_top_corners">
<!--image view for displaying course image-->
<ImageView
android:id="#+id/idIVCourse"
android:layout_width="100dp"
android:layout_height="100dp"
android:layout_margin="10dp"
android:src="#drawable/ic_launcher_background" />
<!--text view for displaying course name-->
<TextView
android:id="#+id/idTVCourseName"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:layout_toEndOf="#id/idIVCourse"
android:layout_toRightOf="#id/idIVCourse"
android:text="DSA Self Paced Course"
android:textColor="#color/black"
android:textSize="18sp"
android:textStyle="bold" />
<!--text view for displaying course tracks-->
<TextView
android:id="#+id/idTVCourseTracks"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/idTVCourseName"
android:layout_marginTop="10dp"
android:layout_toEndOf="#id/idIVCourse"
android:layout_toRightOf="#id/idIVCourse"
android:text="Course Tracks : 30"
android:textColor="#color/black"
android:textSize="15sp" />
<!--text view for displaying course duration-->
<TextView
android:id="#+id/idTVCourseDuration"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/idTVCourseTracks"
android:layout_marginTop="10dp"
android:layout_toEndOf="#id/idIVCourse"
android:layout_toRightOf="#id/idIVCourse"
android:text="Course Duration : 4 Months"
android:textColor="#color/black"
android:textSize="15sp" />
<!--button for dismissing our dialog-->
<Button
android:id="#+id/idBtnDismiss"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/idIVCourse"
android:layout_margin="10dp"
android:text="Dismiss dialog"
android:textAllCaps="false" />
</RelativeLayout>
</RelativeLayout>
where #drawable/rounded_top_corners will be:
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<solid android:color="#android:color/white" />
<corners android:topLeftRadius="30dp" android:topRightRadius="30dp"
android:bottomLeftRadius="0dp" android:bottomRightRadius="0dp"/>
</shape>
2.You have to set a custom theme style for BottomSheetDialog with a Transparent window dialog like below:
val dialog = BottomSheetDialog(this, R.style.MyBottomSheetDialog)
where R.style.MyBottomSheetDialog is your custom BottomSheetDialog style defined in styles.xml like below:
<style name="MyBottomSheetDialog" parent="Theme.Design.Light.BottomSheetDialog">
<item name="android:colorBackground">#android:color/transparent</item>
<item name="android:backgroundDimEnabled">true</item>
<item name="android:backgroundDimAmount">0.3</item>
<item name="android:windowFrame">#null</item>
<item name="android:windowIsTranslucent">true</item>
<item name="android:windowContentOverlay">#null</item>
</style>
After the above changes you will have a Transparent Window BottomSheetDialog with a line on top like:

The Number of Stars in the RatingBar Looks Wrong

The number of stars in the RatingBar seems to be more than I have set. Although I set it to 5, more stars appear on the screen. The screen shots are below. However, the normal number appears when choosing the stars.
My empty RatingBar's stars count are not coming true. Empty ratingbar is not showing, android default RatingBar is shown. When my RatingBar is filling, both of my filled RatingBar and android default RatingBar is showing.
My code is as follows:
<LinearLayout 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"
android:orientation="vertical">
<LinearLayout
android:id="#+id/header_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/colorPrimary"
android:gravity="center"
android:orientation="horizontal"
android:padding="20dp">
<TextView
android:id="#+id/ratingInfo"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/callRatingBar"
android:textColor="#color/white"
android:textSize="#dimen/topTitle" />
</LinearLayout>
<RatingBar
android:id="#+id/ratingBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="20dp"
android:isIndicator="false"
android:numStars="5"
android:progressBackgroundTint="#color/transparent_black_30"
android:stepSize="1"
android:theme="#style/"
tools:rating="1" />
<TextView
android:id="#+id/limit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end|center_horizontal"
android:contentDescription="#null"
android:gravity="end|center_horizontal"
android:paddingEnd="20dp"
android:paddingRight="20dp"
android:text="200"
android:textColor="#color/grey"
android:textSize="#dimen/infoTitle" />
<com.project.android.util.view.CustomEditText
android:id="#+id/commentText"
style="#style/EditTextStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="15dp"
android:fadeScrollbars="true"
android:fastScrollAlwaysVisible="false"
android:fastScrollEnabled="true"
android:gravity="start"
android:hint="#string/leaveAComment"
android:maxLength="200"
android:minHeight="40dp"
android:nextFocusRight="#+id/textSendButton"
android:nextFocusForward="#+id/textSendButton"
android:scrollbarStyle="outsideOverlay"
android:scrollbarThumbVertical="#drawable/edittext_scrollbar"
android:scrollbars="vertical"
android:scrollingCache="false"
android:scrollHorizontally="false"
android:smoothScrollbar="true"
android:textSize="#dimen/infoTitle"
app:emojiSize="#dimen/conversation_emojiSize" />
MyRatingBar style:
<style name="MyRatingBar" parent="Theme.AppCompat">
<item name="colorControlNormal">#color/lightTransparentBlack</item>
<item name="colorControlActivated">#color/pin_yellow</item>
<item name="android:numStars">5</item>
</style>
Have you tried setting the amount of stars via code?
ratingBar.setRating(int)
The ratingbar is known for having weird bugs like this
Also look at the various reasons for it not working here

Setting the background using styles

How to set layout drawable background using styles.xml? In the layout I'm using 2 drawable buttons.
When I using this in styles.xml all buttons change the background to what is in styles, but I want to change only the layout background.
<style name="menutheme">
<item name="android:background">#drawable/menu</item>
</style>
My layout:
<android.support.constraint.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"
android:theme="#style/menutheme"
android:contentDescription="#null"
tools:context="com.example.user.app.Activity2">
<RelativeLayout
android:layout_width="312dp"
android:layout_height="371dp"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.955">
<Button
android:id="#+id/entrycity"
android:layout_width="243dp"
android:layout_height="65dp"
android:layout_below="#+id/button3"
android:layout_centerHorizontal="true"
android:layout_marginTop="26dp"
android:background="#drawable/oval3"
android:fontFamily="#font/ultra"
android:text="#string/wybor2"
android:textColor="#android:color/background_light"
android:textSize="30sp"
tools:layout_editor_absoluteX="59dp"
tools:layout_editor_absoluteY="334dp" />
<Button
android:id="#+id/button3"
android:layout_width="243dp"
android:layout_height="65dp"
android:layout_alignParentTop="true"
android:layout_alignStart="#+id/entrycity"
android:background="#drawable/oval"
android:fontFamily="#font/ultra"
android:text="#string/wybor"
android:textColor="#android:color/background_light"
android:textSize="30sp"
tools:layout_editor_absoluteX="71dp"
tools:layout_editor_absoluteY="227dp" />
</RelativeLayout
</android.support.constraint.ConstraintLayout>
try WindowBackground instead of background. Like,
<style name="menutheme" parent="AppTheme">
<item name="android:windowBackground">#drawable/menu</item>
</style>
and you need to apply this theme to acivity in manifest. not in layout.

Categories

Resources