How to make a clickable star-button in android studio?

user_18636961 0
Viewed 43

I'm trying to make a clickable star button which will have a fill in color of red when clicked on. Before I click the build button, Android Studio does not highlight and error in my program. However, it is after I click the build button that Android Studio shows that everything is wrong with my styles.xml file but I am not sure how I can fix it.

MainActivity.java

package com.pace.importantbutton;

import androidx.appcompat.app.AppCompatActivity;

import android.os.Bundle;
import android.view.View;
import android.widget.Toast;
public class MainActivity extends AppCompatActivity {

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}

public void onDefaultToggleClick(View view){
  Toast.makeText(this,"DefaultToggleClick", Toast.LENGTH_SHORT).show();
}

public void onCustomToggleClick(View view){
   Toast.makeText(this,"CustomToggle", Toast.LENGTH_SHORT).show();
}

}

activity_main.xml

<?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:layout_width="match_parent"
    android:layout_height="match_parent"
    android:gravity="center"
    android:orientation="vertical"
    tools:context=".MainActivity">
   

     <ToggleButton
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:onClick="onDefaultToggleClick"
        />
       

    <ToggleButton

        android:layout_width="50dp"
        android:layout_height="wrap_content"
        android:layout_margin="10dp"
        android:textOn=""
        android:textOff=""
        android:background="@drawable/toggle_selector"
        android:onClick="onCustomToggleClick"
         />
        </LinearLayout>

styles.xml

<?xml version="1.0" encoding="utf-8"?>

    <resources>

    <!-- Base application theme. -->
    <Style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
        <!-- Theme will be customized here. -->
        <item name="colorPrimary">@color/colorPrimary</item>
        <item name="colorPrimaryDark">@color/colorPrimaryDark</item>
        <item name="colorAccent">@color/colorAccent</item>

    </Style>

     </resources>

toggle_selector.xml

    <?xml version="1.0" encoding="utf-8"?>
    <selector xmlns:android="http://schemas.android.com/apk/res/android">


    <item android:drawable="@drawable/ic_baseline_star_outline_24" android:state_checked="false"></item>
    <item android:drawable="@drawable/ic_baseline_star_24" android:state_checked="true"></item>

</selector>

ic_baseline_star_outline_24.xml

    <vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="24dp"
    android:height="24dp"
    android:viewportWidth="24"
    android:viewportHeight="24"
    android:tint="?attr/colorControlNormal">
  <path
      android:fillColor="@android:color/holo_red_light"
      android:pathData= "..."
/>
    </vector>

ic_baseline_star_24.xml

    <vector xmlns:android="http://schemas.android.com/apk/res/android"
    android:width="24dp"
    android:height="24dp"
    android:viewportWidth="24"
    android:viewportHeight="24"
    android:tint="?attr/colorControlNormal">
  <path
      android:fillColor="@android:color/holo_red_light"
      android:pathData= "..."
       />
      </vector>
android-studio android java
1 Answers

I do it in my project by using an ImageView.

ImageView favorite = findViewById(R.id.favoriteButton);
//Here you put the logic to start with the outline or the filled star
if (user.isFavorite(productKey)) favorite.setImageDrawable(getDrawable(R.drawable.ic_filled_star));
else  favorite.setImageDrawable(getDrawable(R.drawable.ic_outline_star));
//Finally you set your listener to change the image 
favProduct.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            if (favorite.getDrawable().getID()==R.drwable.ic_filled_star){
                favorite.setImageDrawable(getDrawable(R.drawable.ic_outline_star));
                //The other things you want to do
            }
            else{
                favProduct.setImageDrawable(getDrawable(R.drawable.ic_filled_star));
                //The other things you want to do
            }
        }
});
user_187839890
Related