I have a recyclerView currently set up to add a drop shadow to the bottom of each item with spacing which works well. I want to add a thin gray border around each item as well as a soft rounding if possible. Code so far:
public class VerticalSpaceItemDecorator extends RecyclerView.ItemDecoration {
private final int verticalSpaceHeight;
public VerticalSpaceItemDecorator(int verticalSpaceHeight) {
this.verticalSpaceHeight = verticalSpaceHeight;
}
#Override
public void getItemOffsets(Rect outRect,
View view,
RecyclerView parent,
RecyclerView.State state) {
// 1. Determine whether to add a spacing decorator
if (parent.getChildAdapterPosition(view) != parent.getAdapter().getItemCount() - 1) {
// 2. Set the bottom offset to the specified height
outRect.bottom = verticalSpaceHeight;
}
}
}
public class ShadowVerticalSpaceItemDecorator extends RecyclerView.ItemDecoration {
private Drawable divider;
public ShadowVerticalSpaceItemDecorator(Context context) {
// Use the default style divider
final TypedArray styledAttributes = context.obtainStyledAttributes(
new int[] { android.R.attr.listDivider });
this.divider = styledAttributes.getDrawable(0);
styledAttributes.recycle();
}
public ShadowVerticalSpaceItemDecorator(Context context, int resId) {
// Use a custom divider specified by a drawable
this.divider = ContextCompat.getDrawable(context, resId);
}
#Override
public void onDraw(Canvas c, RecyclerView parent, RecyclerView.State state) {
// 1. Get the parent (RecyclerView) padding
int left = parent.getPaddingLeft();
int right = parent.getWidth() - parent.getPaddingRight();
// 2. Iterate items of the RecyclerView
for (int childIdx = 0; childIdx < parent.getChildCount(); childIdx++) {
// 3. Get the item
View item = parent.getChildAt(childIdx);
// 4. Determine the item's top and bottom with the divider
RecyclerView.LayoutParams params = (RecyclerView.LayoutParams) item.getLayoutParams();
int top = item.getBottom() + params.bottomMargin;
int bottom = top + divider.getIntrinsicHeight();
// 5. Set the divider's bounds
this.divider.setBounds(left, top, right, bottom);
// 6. Draw the divider
this.divider.draw(c);
}
}
}
Custom layout of recyclerView items:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/white"
android:orientation="vertical">
<ImageView
android:id="#+id/imageView"
android:layout_width="match_parent"
android:layout_height="80dp"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:paddingLeft="5dp"
android:paddingRight="5dp"
app:srcCompat="#mipmap/ic_launcher" />
<TextView
android:id="#+id/textView_title"
style="#style/AudioFileInfoOverlayText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/imageView"
android:layout_alignLeft="#+id/imageView"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignStart="#+id/imageView"
android:layout_gravity="left"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:text="TextView"
android:textColor="#android:color/white"
android:textSize="22sp" />
<TextView
android:id="#+id/textView_info"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/imageView"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignStart="#+id/textView_title"
android:layout_below="#+id/imageView"
android:layout_marginTop="12dp"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:text="TextView" />
<Button
android:id="#+id/button_one"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_below="#+id/textView_info"
android:layout_marginBottom="5pt"
android:layout_marginRight="5pt"
android:background="#drawable/circle_button"
android:text="One"
android:textColor="#android:color/white" />
<Button
android:id="#+id/button_two"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/imageView"
android:layout_below="#+id/textView_info"
android:layout_marginBottom="5pt"
android:layout_marginLeft="5pt"
android:background="#drawable/circle_button"
android:backgroundTint="?android:attr/colorControlHighlight"
android:text="Two"
android:textColor="#android:color/white" />
</RelativeLayout>
</LinearLayout>
drop_shadow code:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<size android:height="4dp" />
<solid android:color="#color/darkGray" />
<corners android:topLeftRadius="0dp" android:topRightRadius="0dp"
android:bottomLeftRadius="5dp" android:bottomRightRadius="5dp"/>
</shape>
Border:
<?xml version="1.0" encoding="UTF-8"?>
<stroke android:width="3dp"
android:color="#color/gray"
/>
<padding android:left="1dp"
android:top="1dp"
android:right="1dp"
android:bottom="1dp"
/>
<corners android:bottomRightRadius="7dp"
android:bottomLeftRadius="7dp"
android:topLeftRadius="7dp"
android:topRightRadius="7dp"/>
Create Xml on Drawable folder named border.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<stroke android:color="#color/colorAccent" android:width="1dp"/>
<corners android:radius="5dp" />
</shape>
then after change background of RelativeLayout
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/border"
android:orientation="vertical">
<ImageView
android:id="#+id/imageView"
android:layout_width="match_parent"
android:layout_height="80dp"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:paddingLeft="5dp"
android:paddingRight="5dp"
app:srcCompat="#mipmap/ic_launcher" />
<TextView
android:id="#+id/textView_title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/imageView"
android:layout_alignLeft="#+id/imageView"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignStart="#+id/imageView"
android:layout_gravity="left"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:text="TextView"
android:textColor="#android:color/white"
android:textSize="22sp" />
<TextView
android:id="#+id/textView_info"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/imageView"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_alignStart="#+id/textView_title"
android:layout_below="#+id/imageView"
android:layout_marginTop="12dp"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:text="TextView" />
<Button
android:id="#+id/button_one"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_below="#+id/textView_info"
android:layout_marginBottom="5pt"
android:layout_marginRight="5pt"
android:text="One"
android:textColor="#android:color/white" />
<Button
android:id="#+id/button_two"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/imageView"
android:layout_below="#+id/textView_info"
android:layout_marginBottom="5pt"
android:layout_marginLeft="5pt"
android:backgroundTint="?android:attr/colorControlHighlight"
android:text="Two"
android:textColor="#android:color/white" />
</RelativeLayout>
</LinearLayout>
If you want to bold the border then <stroke android:color="#color/colorAccent" android:width="5dp"/>
Related
Friends, I'm trying to set height of view1 to the height of the filled text textView1, but it doesn’t work. view1 is thus infinitely long and exceeds the height of the text, occupies the entire screen, but I need to the end of the text.
<androidx.cardview.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/cv">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:weightSum="3"
android:background="#android:color/white">
<View
android:id="#+id/view1"
android:background="#drawable/rectangle_with_color"
android:layout_height="wrap_content"
android:layout_width="16dp" />
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginLeft="25dp"
android:layout_marginTop="3dp"
android:text="Не следует, однако забывать, что начало повседневной работы по формированию позиции представляет собой интересный эксперимент проверки новых предложений. С другой стороны реализация намеченных плановых заданий представляет собой интересный эксперимент проверки форм развития."
android:gravity="top"
/>
</RelativeLayout>
</androidx.cardview.widget.CardView>
rectangle_with_color.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid
android:color="#E41300" />
</shape>
Fixed your bug. Please use this code below:
<View
android:id="#+id/view1"
android:background="#drawable/blank_checkbox"
android:layout_height="wrap_content"
android:layout_width="16dp"
android:layout_alignBottom="#+id/textView1"/> //make this change
You need to set alignBottom property to mark its end.
As per documentation:
alignBottom: Makes the bottom edge of this view match the bottom edge
of the given anchor view ID. Accommodates bottom margin.
try this code :
<?xml version="1.0" encoding="utf-8"?>
<androidx.cardview.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/cv">
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:weightSum="3"
android:background="#android:color/white">
<View
android:id="#+id/view1"
android:background="#drawable/rectangle_with_color"
android:layout_height="wrap_content"
android:layout_width="16dp"
android:layout_alignBottom="#+id/textView1"/>
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginLeft="25dp"
android:layout_marginTop="3dp"
android:text="Не следует, однако забывать, что начало повседневной работы по формированию позиции представляет собой интересный эксперимент проверки новых предложений. С другой стороны реализация намеченных плановых заданий представляет собой интересный эксперимент проверки форм развития."
android:gravity="top" />
</RelativeLayout>
</androidx.cardview.widget.CardView>
I am showing a PopupWindow and setting its background as 9 patch image. PopupWindows background becomes transparent when it becomes visible. I am unable to find out issue. How should it be resolved?
Here is my code.
LayoutInflater inflater = LayoutInflater.from(context);
View panel = inflater.inflate(R.layout.add_collection, null);
panel.setLayoutParams(new ViewGroup.LayoutParams
(ViewGroup.LayoutParams.WRAP_CONTENT,
ViewGroup.LayoutParams.WRAP_CONTENT));
panel.measure(View.MeasureSpec.UNSPECIFIED, View.MeasureSpec.UNSPECIFIED);
int status_bar_height = 0;
int resourceId = context.getResources().getIdentifier("status_bar_height" ,
"dimen" , "android");
if(resourceId > 0){
status_bar_height = context.getResources().getDimensionPixelSize(resourceId);
}
popupWindow = new PopupWindow(panel,
WindowManager.LayoutParams.WRAP_CONTENT,
WindowManager.LayoutParams.WRAP_CONTENT);
Drawable drawable = ContextCompat.getDrawable(context, R.drawable.menu_popup_bg);
popupWindow.setBackgroundDrawable(drawable);
if(Build.VERSION.SDK_INT >= Build.VERSION_CODES.LOLLIPOP) {
popupWindow.setElevation(48);
}
popupWindow.setInputMethodMode(PopupWindow.INPUT_METHOD_NEEDED);
popupWindow.setFocusable(true);
popupWindow.setTouchable(true);
popupWindow.setOutsideTouchable(true);
popupWindow.showAtLocation(anchor, Gravity.TOP | Gravity.END, 0,
status_bar_height);
Here is my add_collection.xml file
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="#dimen/_10sdp"
android:orientation="vertical">
<TextView
android:id="#+id/title"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="#dimen/_6sdp"
android:layout_marginTop="#dimen/_4sdp"
android:text="Add New Collection"
android:textColor="#color/white"
android:textSize="#dimen/_11sdp" />
<com.suntec.oneread.customviews.OREditText
android:id="#+id/et_collection_name"
android:layout_width="match_parent"
android:layout_height="#dimen/_24sdp"
android:background="#drawable/edittext_border"
android:ems="10"
android:gravity="center_vertical"
android:hint="Collection Name"
android:inputType="textCapWords|textCapSentences"
android:maxLength="15"
android:maxLines="1"
android:minWidth="#dimen/_160sdp"
android:paddingLeft="#dimen/_4sdp"
android:paddingRight="#dimen/_4sdp"
android:textColor="#color/text_color"
android:textColorHint="#color/text_color"
android:textSize="#dimen/_10sdp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="#dimen/_10sdp"
android:orientation="horizontal">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginRight="#dimen/_4sdp"
android:layout_weight="1"
android:orientation="horizontal">
<Button
android:id="#+id/btnSave"
android:layout_width="match_parent"
android:layout_height="#dimen/_25sdp"
android:background="#color/btn_background"
android:text="Save"
android:textAllCaps="false"
android:textColor="#color/white"
android:textSize="#dimen/_12sdp" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/_4sdp"
android:layout_weight="1"
android:orientation="horizontal">
<Button
android:id="#+id/btnCancel"
android:layout_width="match_parent"
android:layout_height="#dimen/_25sdp"
android:background="#color/btn_background"
android:text="Cancel"
android:textAllCaps="false"
android:textColor="#color/white"
android:textSize="#dimen/_12sdp" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
and here is menu_popup_bg.xml file. I am setting drawable as 9 patch image.
<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_window_focused="false" android:state_selected="true"
android:drawable="#drawable/menu_bg_light_grey" />
<item android:state_selected="true" android:drawable="#drawable/menu_bg_light_grey" />
<item android:state_pressed="true" android:state_selected="false"
android:drawable="#drawable/menu_bg_light_grey" />
<item android:state_selected="false" android:drawable="#drawable/menu_bg_light_grey" />
</selector>
Is there any way to get something like that, plus the button to clean/delete the text when it contains something?
<android.support.design.widget.TextInputLayout
android:id="#+id/text_input_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Inserisci Username">
<EditText
android:id="#+id/editText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="Username"
android:inputType="text" />
</android.support.design.widget.TextInputLayout>
I know it's been a while, but maybe it helps someone.
If you use Material components, you can use app:endIconMode="clear_text", for example:
<com.google.android.material.textfield.TextInputLayout
android:id="#+id/key_word_wrapper"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:hintEnabled="true"
android:hint="#string/key_word"
style="#style/Widget.MaterialComponents.TextInputLayout.OutlinedBox.Dense"
android:layout_gravity="center_horizontal"
app:endIconMode="clear_text">
<com.google.android.material.textfield.TextInputEditText
android:id="#+id/key_word"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:inputType="text" />
</com.google.android.material.textfield.TextInputLayout>
This will bring up the little X button as soon as the text has been entered, and will automatically work as expected.
Read more options at Text fields
To clear the text from edit text
#Override
public void onClick(View v) {
editText.getText().clear();
//or you can use editText.setText("");
}
To put the button inside edittext just make the custom layout
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/white"
>
<RelativeLayout android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/oval"
android:layout_centerInParent="true"
>
<android.support.design.widget.TextInputLayout
android:id="#+id/text_input_layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:layout_toLeftOf="#+id/id_search_button"
android:hint="Inserisci Username">
<EditText
android:id="#+id/editText"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="username"
android:background="#android:color/transparent"
android:inputType="text" />
</android.support.design.widget.TextInputLayout>
<ImageButton android:id="#+id/id_search_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginRight="5dp"
android:layout_centerVertical="true"
android:background="#drawable/ic_clear_black"
android:layout_alignParentEnd="true" />
</RelativeLayout>
</RelativeLayout>
drawable oval
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="rectangle">
<solid android:color="#ffffff"/>
<stroke android:width="2px" android:color="#ff00ffff"/>
<corners android:radius="24dp" />
</shape>
To hide focus of the editText when app starts
add these lines inside activity tag of your class name in manifest file
<activity
android:name=".yourActivityName"
android:windowSoftInputMode="stateAlwaysHidden"
android:focusable="true"
android:focusableInTouchMode="true"
/>
You can set property of Layout like android:descendantFocusability="beforeDescendants" and android:focusableInTouchMode="true"
<RelativeLayout 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:descendantFocusability="beforeDescendants"
android:focusableInTouchMode="true"
xmlns:ads="http://schemas.android.com/apk/res-auto"
>
You could use onTouchEvent() for determine user touch to 'clear text' icon
#SuppressLint("ClickableViewAccessibility")
#Override
public boolean onTouchEvent(MotionEvent event) {
if (event.getAction() == MotionEvent.ACTION_UP) {
final int x = (int) event.getX();
final int y = (int) event.getY();
if (x >= (this.getRight() - drawableClearText.getBounds().width()) && x <= (this.getRight() - this.getPaddingRight())
&& y >= this.getPaddingTop() && y <= (this.getHeight() - this.getPaddingBottom())) {
this.setText("");
event.setAction(MotionEvent.ACTION_CANCEL);
}
}
return super.onTouchEvent(event);
}
To manage the icon states(visible, invisible) you may use TextViewCompat.setCompoundDrawablesRelative(your_edit_text, compounds[0], compounds[1], drawableClearText, compounds[3])
I want to have an app with similar notification counter on the right side of the Imageview: here is the photo of my layout:
I want to have such Notification Counter:
Here is my activity_menu layout:
<?xml version="1.0" encoding="utf-8"?>
<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:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="datasite.com.konnex.Menu"
android:background="#ffffff">
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#3fc0ea">
<ImageButton
android:layout_width="120dp"
android:layout_height="38dp"
android:background="#drawable/lg1"
android:layout_marginLeft="130dp" />
<SearchView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="90dp"/>
</android.support.v7.widget.Toolbar>
<FrameLayout
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1">
<GridLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:columnCount="2">
<ImageView
android:layout_width="90dp"
android:layout_height="90dp"
android:src="#drawable/cases"
android:layout_marginLeft="60dp"
android:layout_marginTop="40dp"
android:id="#+id/img_cases"/>
<ImageView
android:layout_width="90dp"
android:layout_height="90dp"
android:src="#drawable/invoices"
android:layout_marginLeft="80dp"
android:layout_marginTop="40dp" />
<ImageView
android:layout_width="90dp"
android:layout_height="90dp"
android:src="#drawable/announcement"
android:layout_marginLeft="60dp"
android:layout_marginTop="40dp" />
<ImageView
android:layout_width="90dp"
android:layout_height="90dp"
android:src="#drawable/users"
android:layout_marginTop="40dp"
android:layout_marginLeft="80dp"/>
<ImageView
android:layout_width="90dp"
android:layout_height="90dp"
android:src="#drawable/document"
android:layout_marginTop="60dp"
android:layout_marginLeft="60dp" />
<ImageView
android:layout_width="90dp"
android:layout_height="90dp"
android:src="#drawable/meetings"
android:layout_marginTop="60dp"
android:layout_marginLeft="80dp"/>
</GridLayout>
</FrameLayout>
<android.support.design.widget.BottomNavigationView
android:id="#+id/navigation"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#fffafa"
app:menu="#menu/navigation"
app:itemIconTint="#color/dark"
app:itemTextColor="#color/dark" />
</LinearLayout>
Here is my menu.java class:
public class Menu extends AppCompatActivity {
private BottomNavigationView.OnNavigationItemSelectedListener mOnNavigationItemSelectedListener
= new
BottomNavigationView.OnNavigationItemSelectedListener() {
#Override
public boolean onNavigationItemSelected(#NonNull MenuItem item) {
switch (item.getItemId()) {
case R.id.nav_about:
return true;
case R.id.nav_location:
return true;
case R.id.nav_phone:
return true;
case R.id.nav_home:
return true;
}
return false;
}
};
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_menu);
}
}
Please help to find solution to this problem. I have searched many answers but haven't found the solution specific to my case. Thanks in advance!
Wrap your every ImageView in FrameLayout like this.
<GridLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:columnCount="2">
<FrameLayout
android:layout_width="90dp"
android:layout_height="90dp">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/cases"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="1"
android:background="#android:color/red"
android:layout_gravity="top|end"/>
</FrameLayout>
</GridLayout>
<RelativeLayout
android:layout_width="100dp"
android:layout_height="100dp">
<ImageView
android:layout_width="100dp"
android:layout_height="100dp" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#fc0505"
android:text="10"
android:layout_alignParentRight="true"
android:textSize="18sp"/>
</RelativeLayout>
Wrap your images inside GridLayout with RelativeLayout and put the notificaton indicators inside RelativeLayout.
Example:
<RelativeLayout
android:layout_width="90dp"
android:layout_height="90dp">
<ImageView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/cases"
android:layout_marginLeft="60dp"
android:layout_marginTop="40dp"
android:id="#+id/img_cases"/>
<TextView
android:id="#+id/item1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#FFFFFF"
android:background="#FF0000"/>
</RelativeLayout>
and you can update them via
GridLayout gridLayout....
TextView item1 = (TextView) gridLayout.findViewById(R.id.item1);
item1.setText("3"); // 3 notifications
You can use a Constraint layout as follows :
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/filter"
android:layout_width="30dp"
android:layout_height="30dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:srcCompat="#drawable/ic_baseline_filter_list_24px" />
<TextView
android:id="#+id/counter"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/circular_border"
android:gravity="center"
android:textSize="10sp"
android:textColor="#FFFFFF"
card_view:layout_constraintStart_toEndOf="#string/filter"
card_view:layout_constraintEnd_toEndOf="parent"
card_view:layout_constraintTop_toTopOf="#id/filter"/>
</androidx.constraintlayout.widget.ConstraintLayout>
Add a Drawable resource file for adding background to counter as follows :
<?xml version="1.0" encoding="utf-8"?>
<ripple xmlns:android="http://schemas.android.com/apk/res/android"
android:color="?android:colorControlHighlight">
<item xmlns:android="http://schemas.android.com/apk/res/android">
<shape android:shape="oval">
<solid android:color="#DD2C00" />
<stroke android:color="#FFFFFF" android:width="1dp" />
<size
android:height="15dp"
android:width="15dp" />
</shape>
</item>
</ripple>
I want to change the bitmap image in the xml file which is in the drawable folder manually through java code. Please help me with that.
<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
<item android:drawable="#color/colorPrimary"/>
<item>
<bitmap android:src="#drawable/bebe" android:gravity="center"android:alpha="0.1"/>
</item>
<item android:top="300dp"
android:bottom="-300dp"
android:left="0dp"
android:right="-300dp">
<rotate
android:fromDegrees="-10"
android:pivotX="0%"
android:pivotY="100%">
<shape
android:shape="rectangle">
<solid
android:color="?android:colorBackground"/>
</shape>
</rotate>
</item>
Java code:
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
Toolbar toolbar = (Toolbar) findViewById(R.id.toolbar);
setSupportActionBar(toolbar);
if (getSupportActionBar() != null) {
getSupportActionBar().setTitle("");
getSupportActionBar().setHomeButtonEnabled(true);
getSupportActionBar().setDisplayHomeAsUpEnabled(true);
}
}
This is the main activity through which the background file is linked:
<RelativeLayout
android:id="#+id/background"
android:layout_width="match_parent"
android:layout_height="300dp"
android:background="#drawable/background" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/background"
android:layout_marginStart="20dp"
android:layout_marginTop="-100dp">
<com.mikhaellopez.circularimageview.CircularImageView
android:layout_width="150dp"
android:layout_height="150dp"
android:id="#+id/iv"
android:src="#drawable/bebe_pp"
app:civ_border_color="#color/semiTransparentWhite"
app:civ_border_width="10dp" />
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_marginStart="12dp"
android:layout_marginEnd="12dp"
android:layout_marginBottom="24dp"
android:layout_gravity="bottom">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="sans-serif-light"
android:text="Bebe Rexha"
android:textSize="30sp"
android:textColor="#android:color/black"
android:id="#+id/tv" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="sans-serif-light"
android:text="musician, singer, songwriter"
android:textSize="14sp"
android:id="#+id/tv2" />
</LinearLayout>
</LinearLayout>
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?android:attr/actionBarSize"
android:layout_marginTop="24dp"
app:theme="#style/TransparentBar">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:fontFamily="sans-serif-light"
android:gravity="center_vertical"
android:text="About"
android:textSize="24sp" />
</android.support.v7.widget.Toolbar>
</RelativeLayout>