How do I add a text background to a button in android? - android

I've designed buttons as shown in the image above. But I'm unable to add the text background (which is circled) to the button.
How to achieve that?
Here is what I have achieved so far:
<View
android:id="#+id/centerVertical"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_centerVertical="true"
android:visibility="invisible" />
<View
android:id="#+id/centerHorizontal"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
android:visibility="invisible" />
<Button
android:id="#+id/today_btn"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/centerVertical"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_toLeftOf="#+id/centerHorizontal"
android:layout_marginTop="20px"
android:layout_marginBottom="10px"
android:layout_marginLeft="20px"
android:layout_marginRight="10px"
android:background="#drawable/button1"
android:gravity="center"
android:text="Today"
android:textColor="#FFFFFF" >
</Button>
<Button
android:id="#+id/nextweek_btn"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/centerVertical"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_toRightOf="#+id/centerHorizontal"
android:layout_marginTop="20px"
android:layout_marginBottom="10px"
android:layout_marginLeft="10px"
android:layout_marginRight="20px"
android:background="#EF5350"
android:gravity="center"
android:text="Next Week"
android:textColor="#FFFFFF" >
</Button>
<Button
android:id="#+id/later_btn"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_below="#+id/centerVertical"
android:layout_toLeftOf="#+id/centerHorizontal"
android:layout_marginTop="10px"
android:layout_marginBottom="20px"
android:layout_marginLeft="20px"
android:layout_marginRight="10px"
android:background="#66BB6A"
android:gravity="center"
android:text="Later"
android:textColor="#FFFFFF" >
</Button>
<Button
android:id="#+id/range_btn"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_below="#+id/centerVertical"
android:layout_toRightOf="#+id/centerHorizontal"
android:layout_marginTop="10px"
android:layout_marginBottom="20px"
android:layout_marginLeft="10px"
android:layout_marginRight="20px"
android:background="#5C6BC0"
android:gravity="center"
android:text="Range"
android:textColor="#FFFFFF" >
</Button>
XML Layout

<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_below="#+id/centerVertical"
android:layout_marginBottom="20px"
android:layout_marginLeft="10px"
android:layout_marginRight="20px"
android:layout_marginTop="10px"
android:layout_toRightOf="#+id/centerHorizontal">
<Button
android:id="#+id/range_btn"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#5C6BC0"
android:gravity="center"
android:text="Range"
android:textColor="#FFFFFF" />
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#061FAF"
android:drawableRight="#drawable/mail_icon"
android:text="range text"
android:textColor="#FFFFFF" />
</RelativeLayout>

You can do this easily with adding RelativeLayout instead of Button.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="80dp"
android:layout_alignParentBottom="true">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="20dp"/>
<Button
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_centerVertical="true"
android:layout_alignParentEnd="true"
android:layout_marginRight="20dp"/>
</RelativeLayout>
Just set text to TextView and add source to Button.

You need to do like this.
<?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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ImageView
android:layout_width="match_parent"
android:layout_height="250dp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:oreantation="horizontal">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="12dp"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>

https://stackoverflow.com/a/8823469/5898862
This is best solution for creating customized button using layout. You can easily set background color using android:background property

As per my understanding, what you want is - You need a button background color which is similar/near to image on it.?
In Android Version 5.0, a class is added which help you to extract color from bitmap. Palette
Below is the sample code which you will get the respective background from the image and later you can set it to the button.
Palette.generateAsync(bitmap, new Palette.PaletteAsyncListener() {
public void onGenerated(Palette palette) {
// You will get color here
}
});
Possible combination of colors are:
Vibrant
Vibrant Dark
Vibrant Light
Muted
Muted Dark
Muted Light
To use above class add the following dependencies in your project:
dependencies {
...
compile 'com.android.support:palette-v7:21.0.+'
}
======================or=========================
Another way is you can get respective color by image bitmap:
public static int getRespectiveColor(Bitmap bitmap) {
Bitmap newBitmap = Bitmap.createScaledBitmap(bitmap, 1, 1, true);
final int color = newBitmap.getPixel(0, 0);
newBitmap.recycle();
return color;
}
Hope above both will solve your problem. :) cheers!!!

Related

Android slider drawer custom icon position

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="horizontal" >
<SlidingDrawer
android:id="#+id/drawer"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:content="#+id/content"
android:handle="#+id/handle"
android:orientation="horizontal"
android:rotation="180" >
<ImageView
android:id="#id/handle"
android:layout_width="50dip"
android:layout_height="50dip"
android:rotation="180"
android:src="#drawable/ic_launcher" />
<LinearLayout
android:id="#id/content"
android:layout_width="250dp"
android:layout_height="fill_parent"
android:background="#0000ff"
android:orientation="vertical"
android:rotation="180" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Big Big Button" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Big Big Button" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Big Big Button" />
</LinearLayout>
</SlidingDrawer>
I want to change the icon position and put it on the top position from left to right
Is anyone who can tell me how it to set this custom icon position on android slider drawer>
Thanks in advance
http://i.stack.imgur.com/q8dz2.png
Take a look at your button:
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Big Big Button" />
You can set for it an icon in at least four ways (like in this picture):
You need only to specify where the Drawable should stay.
on the left of text:
android:drawableLeft="#mipmap/ic_launcher"
on the right of text:
android:drawableRight="#mipmap/ic_launcher"
at the top, text below:
android:drawableTop="#mipmap/ic_launcher"
at the bottom, text above:
android:drawableBottom="#mipmap/ic_launcher"
All you need is to add to your button layout one of these possible lines.
Of course to one button, you can add more than one drawable.
NOTE: Read also:
http://developer.android.com/guide/topics/ui/controls/button.html
Hope it help
EDIT: I haven't used SlidingDrawer before, so I cannot recognize, where the problem is, but always you can do a trick like this
<Button
android:id="#+id/one"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text=""
android:drawableTop="#mipmap/ic_launcher"
android:layout_alignParentLeft="true"
android:layout_below="#id/handle"
android:background="#0000ff"
/>
This is a button with your desired image and "transparent" background.
Try it now and I would look for another solution ;-)
SOLUTION: Please try this code:
<SlidingDrawer
android:id="#+id/drawer"
android:layout_width="200dp"
android:layout_height="wrap_content"
android:content="#+id/content"
android:handle="#+id/handle"
android:orientation="horizontal"
android:rotation="180" >
<ImageView
android:id="#id/handle"
android:layout_width="50dip"
android:layout_height="50dip"
android:rotation="180"
android:src="#mipmap/ic_launcher" />
<LinearLayout
android:id="#id/content"
android:layout_width="250dp"
android:layout_height="fill_parent"
android:background="#0000ff"
android:orientation="vertical"
android:rotation="180" >
<ImageView
android:id="#id/handle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:src="#mipmap/ic_launcher" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Big Big Button" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Big Big Button" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Big Big Button" />
</LinearLayout>
</SlidingDrawer>
</LinearLayout>
If you still have any question please free to ask
Sliding drawer is deprecated, and is hard to use but I made a replacement. The only problem about it is that it doesn't slide like the sliding drawer, but it does apear and disapear. Here is the XML part:
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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:orientation="vertical" >
<RelativeLayout
android:layout_width="match_parent"
android:background="#acacac"
android:layout_height="100dp"
android:id="#+id/etc"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Menu"
android:id="#+id/bMenu"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:textColor="#FFFFFF"
android:textSize="30sp"
android:background="#drawable/button_shape_1"
/>
</RelativeLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/linearLayout"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_above="#+id/etc"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:visibility="gone"
android:id="#+id/menuContent">
//content
</RelativeLayout>
</RelativeLayout>
</FrameLayout>
This will by default(on copy/paste) not be shown(half the point)
It must be a framelayout as they allow item to be layed on top of eachother(the root element that is)
The code part:
RelativeLayout menuContent;
Button showMenu;
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.game);
menuContent = (RelativeLayout) findViewById(R.id.menuContent);
showMenu = (Button) findViewById(R.id.bMenu);
showMenu.setOnClickListener(this);
}
boolean menuActive = false;
#Override
public void onClick(View v) {
switch (v.getId()){
case R.id.bMenu:
if(menuActive){
menuActive = false;
menuContent.setVisibility(View.GONE);
}else if(!menuActive){
menuActive = true;
menuContent.setVisibility(View.VISIBLE);
}
break;
}
}
This was copied out of a part of one of my newest games, so if it doesn't work as it sits, let me know and I will take a look at it

How to make ImageView fullscreen programmatically on click?

Here is what I'm trying to do. I have 4 images and they are in one LinearLayout and that LinearLayout is child of RelativeLayout. I have successfully implemented onClickListener. Maybe my question is a little different, but everything is relevant.
I don't know how to extend image to full screen because images are in one LinearLayout which is inside that one RelativeLayout and maybe everything will be clear when I show you guys xml code.
I would like to make ImageView full screen on click and to be able to go back when I click back button. For that I would probably need to use onBackPressed
Images are at the bottom.
So here is the xml code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
xmlns:android="http://schemas.android.com/apk/res/android"
>
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentTop="true"
android:background="#drawable/url"
android:fillViewport="true"
android:orientation="vertical"
android:paddingBottom="5dp"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:paddingTop="5dp"
android:scrollbars="none" >
<RelativeLayout
android:id="#+id/relativeLayout"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<!-- Thumbnail Image -->
<com.dusandimitrijevic.modification.TouchImageView
android:id="#+id/thumbnail"
android:layout_width="140dp"
android:layout_height="220dp"
android:layout_alignParentLeft="true"
android:layout_marginRight="8dp"
android:src="#drawable/ic_horor_filmovi_ikonica" />
<!-- Naslov Filma -->
<TextView
android:id="#+id/naslov"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:textColor="#7F0000"
android:textSize="#dimen/title_movie"
android:layout_toRightOf="#id/thumbnail"
android:layout_toEndOf="#+id/thumbnail" >
</TextView>
<!-- Godina izdanja Filma -->
<TextView
android:id="#+id/releaseYear"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/naslov"
android:layout_alignStart="#+id/naslov"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:layout_below="#+id/naslov"
android:layout_marginTop="3dp"
android:textColor="#color/dark_red" />
<ImageView
android:id="#+id/rating_star"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/thumbnail"
android:layout_marginBottom="42dp"
android:layout_toRightOf="#+id/thumbnail"
android:layout_toEndOf="#+id/thumbnail"
android:src="#drawable/ic_actions_rating_icon" />
<Button
android:id="#+id/url_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/thumbnail"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:layout_toRightOf="#+id/thumbnail"
android:layout_toEndOf="#+id/thumbnail"
style="#style/UrlDugme" />
<TextView
android:id="#+id/rating"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/rating_star"
android:layout_alignTop="#+id/rating_star"
android:layout_toRightOf="#+id/rating_star"
android:layout_toEndOf="#+id/rating_star"
android:gravity="center"
android:textColor="#color/dark_red"
android:textSize="#dimen/rating" />
<!-- Opis Filma -->
<RelativeLayout
android:id="#+id/relativeLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentLeft="true"
android:layout_below="#+id/thumbnail"
android:layout_marginTop="14dp"
android:background="#drawable/layout_round_rect_shape" >
<TextView
android:id="#+id/description"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="18dp"
android:layout_marginTop="16dp"
android:scrollbars="vertical"
android:textColor="#color/dark_red"
android:textSize="18sp" />
</RelativeLayout>
<!-- Opis Filma Zavrsetak -->
<!-- Glumci -->
<RelativeLayout
android:id="#+id/relativeLayout2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/relativeLayout1"
android:layout_marginTop="12dp"
android:background="#drawable/layout_round_rect_shape"
android:orientation="vertical" >
<LinearLayout
android:id="#+id/linearLayoutActors"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<com.android.volley.toolbox.NetworkImageView
android:id="#+id/Image1"
android:layout_width="40dp"
android:layout_height="140dp"
android:layout_gravity="center_horizontal"
android:layout_marginTop="16dp"
android:layout_weight="1"
android:scaleType="fitCenter"
android:src="#drawable/ic_horor_filmovi_ikonica" />
<com.android.volley.toolbox.NetworkImageView
android:id="#+id/Image2"
android:layout_width="40dp"
android:layout_height="140dp"
android:layout_gravity="center_horizontal"
android:layout_marginTop="16dp"
android:layout_weight="1"
android:scaleType="fitCenter"
android:src="#drawable/ic_horor_filmovi_ikonica" />
<com.android.volley.toolbox.NetworkImageView
android:id="#+id/Image3"
android:layout_width="40dp"
android:layout_height="140dp"
android:layout_gravity="center_horizontal"
android:layout_marginTop="16dp"
android:layout_weight="1"
android:scaleType="fitCenter"
android:src="#drawable/ic_horor_filmovi_ikonica" />
</LinearLayout>
<LinearLayout
android:id="#+id/linearLayoutTextView"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/linearLayoutActors"
android:orientation="horizontal" >
<TextView
android:id="#+id/ime1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="Ime"
android:textColor="#7F0000"
android:textSize="16sp" />
<TextView
android:id="#+id/ime2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="Ime"
android:textColor="#7F0000"
android:textSize="16sp" />
<TextView
android:id="#+id/ime3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center"
android:text="Ime"
android:textColor="#7F0000"
android:textSize="16sp" />
</LinearLayout>
</RelativeLayout>
<!-- Glumci -->
<!-- IMAGES I WANT TO MAKE FULLSCREEN ON CLICK -->
<LinearLayout
android:layout_marginTop="12dp"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:background="#drawable/layout_round_rect_shape"
android:id="#+id/linearLayoutImages"
android:layout_below="#+id/relativeLayout2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<com.dusandimitrijevic.modification.TouchImageView
android:id="#+id/image1"
android:adjustViewBounds="true"
android:layout_weight="1"
android:layout_width="115dp"
android:layout_height="150dp"
android:src="#drawable/ic_horor_filmovi_ikonica" >
</com.dusandimitrijevic.modification.TouchImageView>
<com.dusandimitrijevic.modification.TouchImageView
android:id="#+id/image2"
android:adjustViewBounds="true"
android:layout_weight="1"
android:layout_width="115dp"
android:layout_height="150dp"
android:src="#drawable/ic_horor_filmovi_ikonica" >
</com.dusandimitrijevic.modification.TouchImageView>
<com.dusandimitrijevic.modification.TouchImageView
android:id="#+id/image3"
android:adjustViewBounds="true"
android:layout_weight="1"
android:layout_width="115dp"
android:layout_height="150dp"
android:src="#drawable/ic_horor_filmovi_ikonica" >
</com.dusandimitrijevic.modification.TouchImageView>
<com.dusandimitrijevic.modification.TouchImageView
android:id="#+id/image4"
android:adjustViewBounds="true"
android:layout_weight="1"
android:layout_width="115dp"
android:layout_height="150dp"
android:src="#drawable/ic_horor_filmovi_ikonica" >
</com.dusandimitrijevic.modification.TouchImageView>
</LinearLayout>
<!-- IMAGES I WANT TO MAKE FULLSCREEN ON CLICK -->
</RelativeLayout>
</ScrollView>
</RelativeLayout>
And here is onClickListener:
image1.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
int px = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_SP, 115, getResources().getDisplayMetrics());
int px1 = (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_SP, 150, getResources().getDisplayMetrics());
LinearLayout.LayoutParams p = new LinearLayout.
LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.WRAP_CONTENT);
p.weight = 1;
if(isImageFitToScreen) {
image1.setMinimumWidth(px);
image1.setMinimumHeight(px1);
image1.setAdjustViewBounds(true);
isImageFitToScreen=false;
}else{
image1.setLayoutParams(new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, LinearLayout.LayoutParams.MATCH_PARENT));
image1.setScaleType(ImageView.ScaleType.FIT_XY);
isImageFitToScreen=true;
}
}
});
To offer an alternative to Ben's answer and flesh out my earlier comment, one possibility is to create an ImageView in your xml that occupies the entire screen, with its visibility set to gone. On your button press, load the image into this ImageView, and on a back press set the visibility to gone again.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
xmlns:android="http://schemas.android.com/apk/res/android"
>
<ScrollView>
<!-- Everything else! -->
</ScrollView>
<ImageView
android:id="#+id/full_screen_container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="gone" />
</RelativeLayout>
Inside your Activity's onCreate() method:
#Override
public void onCreate(Bundle mySavedInstances) {
ImageView fullScreenContainer = (ImageView) findViewById(R.id.full_screen_container);
image1.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
//However it is you load your images
fullScreenContainer.setImageDrawawble(R.drawable.example);
fullScreenContainer.setVisibility(View.VISIBLE);
}
});
}
#Override
public void onBackPressed() {
if (fullScreenContainer.getVisibility() == View.VISIBLE) {
fullScreenContainer.setImageDrawable(null);
fullScreenContainer.setVisibility(View.GONE);
} else {
super.onBackPressed();
}
}
Welcome to stack overflow Dusan,
I've something very similar, but all I do is just put the full screen image in a new activity & pass the image as bytes & display it in a full screened imageview. As soon as they press back, they're returned to where they were before. I think trying to change the layout parameters is a bit overkill here.
Create new Activity or Fragment and set image to ImageView in new Activity or Fragment. Using Fragment is better approach here as user can click on multiple images one after another. It is less expensive to create or destory Fragment.
Image can be passed to another activity by converting into byte array. It is better approach to save image on server or database such as firebase etc and use generated URL in app. Which make it easy to pass Url between Activities or Fragments than passing byte array

scrollview's child(linear layout)'s background color get changed while scrolling

I was working with scrollview and get the weird problem that I cannot figure out.
I have attached screen shot of graphical view, as I have set one color for the layout background but it get changed while scrolling the view.
Here is my code.
OnCreate of Activity.
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_discussionlist);
ll_comments = (LinearLayout) findViewById(R.id.ll_comments);
for (int i = 0; i < 10; i++) {
View view = LayoutInflater.from(DiscussionListActivity.this)
.inflate(R.layout.comments, null);
ll_comments.addView(view, ll_comments.getChildCount());
Log.print(" ll_comments.getChildCount() ="
+ ll_comments.getChildCount());
}
}
here is activity_discussionlist.xml
<?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:orientation="vertical" >
<RelativeLayout
android:id="#+id/ll_discussion_content"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<TextView
android:id="#+id/txt_submenu_content"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="-5dp"
android:background="#drawable/submenu_bg"
android:gravity="center"
android:paddingBottom="10dp"
android:paddingLeft="15dp"
android:paddingRight="15dp"
android:paddingTop="10dp"
android:text="SubMenu"
android:textColor="#FFFFFF" />
<ImageView
android:id="#+id/img_reply"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="10dp"
android:src="#drawable/ic_reply"
android:visibility="visible" />
</RelativeLayout>
<ScrollView
android:id="#+id/sv_discussion"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:fillViewport="true"
android:scrollbars="none" >
<LinearLayout
android:id="#+id/ll_scroll_main"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical" >
<RelativeLayout
android:id="#+id/rl_discussion"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/discussion_bg"
android:padding="5dp" >
<HorizontalScrollView
android:id="#+id/hl_title"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_marginTop="5dp"
android:scrollbars="none" >
<TextView
android:id="#+id/txt_title"
style="#style/TextTitleBold"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:singleLine="true"
android:text="Homework Questions" />
</HorizontalScrollView>
<TextView
android:id="#+id/txt_uploadedby_date"
style="#style/TextDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/hl_title"
android:layout_marginTop="5dp"
android:ellipsize="end"
android:singleLine="true"
android:text="by Ralph on Oct 01,2013 6:15 AM"
android:textColor="#BBBBBB" />
<TextView
android:id="#+id/txt_posts"
style="#style/TextDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/txt_uploadedby_date"
android:layout_marginTop="5dp"
android:ellipsize="end"
android:singleLine="true"
android:text="12 Comments" />
<TextView
android:id="#+id/txt_descr"
style="#style/TextDescription"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/txt_posts"
android:layout_marginTop="5dp"
android:ellipsize="end"
android:singleLine="false"
android:text=" 0 down vote favorite I am setting up images for different devices as per official google docs.As per google docs we should always use dp(density independent pixels) because pixels may varies for different devices. So i have managed images as per dp(density independent pixels). I have put images in drawable xhdpi,hdpi,mdpi and ldpi. it works well for most of devices but for different devices ppi pixels may varies from device to device so dp(density independent pixels) is not fixed so my all calculations according to dp(density independent pixels) goes wrong and cannot be set properly." />
</RelativeLayout>
<View
android:id="#+id/view_separator"
android:layout_width="fill_parent"
android:layout_height="10dp"
android:layout_marginTop="10dp"
android:background="#BBBBBB" />
<LinearLayout
android:id="#+id/ll_comments"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:orientation="vertical"
android:padding="10dp" >
</LinearLayout>
</LinearLayout>
</ScrollView>
</LinearLayout>
and here is comments.xml file :
<?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="match_parent"
android:paddingBottom="20dp" >
<FrameLayout
android:id="#+id/comment_identity"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:id="#+id/comment_options"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="35dp"
android:background="#ececec"
android:gravity="bottom"
android:orientation="horizontal"
android:weightSum="2" >
<LinearLayout
android:id="#+id/linear_editoption"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="right|center_vertical"
android:padding="10dp" >
<ImageView
android:id="#+id/img_edit"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/img_edit" />
<TextView
android:id="#+id/text_editoption"
style="#style/TextDescriptionBold"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:text="Edit" />
</LinearLayout>
<LinearLayout
android:id="#+id/linear_deleteoption"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center_horizontal|center_vertical"
android:padding="10dp" >
<ImageView
android:id="#+id/img_delete"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/img_delete" />
<TextView
android:id="#+id/text_deleteoption"
style="#style/TextDescriptionBold"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:text="Delete" />
</LinearLayout>
</LinearLayout>
<RelativeLayout
android:id="#+id/rel_commentphoto"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:padding="10dp" >
<ImageView
android:id="#+id/img_commentpic"
android:layout_width="50dp"
android:layout_height="60dp"
android:background="#drawable/img_bg"
android:src="#drawable/profile" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/rel_commentidentity"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<TextView
android:id="#+id/txt_name"
style="#style/TextDescriptionBold"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="70dp"
android:layout_marginTop="10dp"
android:singleLine="true"
android:text="Ralph Johnson" />
<TextView
android:id="#+id/txt_date"
style="#style/TextDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginLeft="10dp"
android:layout_marginTop="10dp"
android:layout_toRightOf="#+id/txt_name"
android:singleLine="true"
android:text="02 Oct,2013 6:00 AM"
android:textColor="#BBBBBB" />
</RelativeLayout>
</FrameLayout>
<TextView
android:id="#+id/txt_comment"
style="#style/TextDate"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/comment_identity"
android:layout_marginTop="5dp"
android:singleLine="false"
android:text="This is test comment.Post your comments here." />
<View
android:layout_width="fill_parent"
android:layout_height="1dp"
android:layout_below="#+id/txt_comment"
android:layout_marginTop="20dp"
android:background="#DDDDDD" />
</RelativeLayout>
As you all can see that I have set the background color only to Linear layout (id of Linear layout is 'comment_options') in comments.xml file.
I have marked red circles in image below. Please see the difference.
The problem isn't with your layout definition or color assignment. Since you are not setting the background property of the base container in activity_discussionlist.xml, the windowBackground property defined for your app-theme is coming into play.
What you are currently seeing is a gradient defined as:
screen_background_selector_light.xml:
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<gradient
android:startColor="#ffe8e8e8"
android:endColor="#ffffffff"
android:angle="270" />
</shape>
So, if your activity's layout was an empty LinearLayout (for example) with no background property set, it would look like this:
Here's where the background might be coming from:
(taken from platforms/android-17/data/res/values/themes.xml)
<style name="Theme.Light">
<item name="windowBackground">#android:drawable/screen_background_selector_light</item>
....
What I think is happening:
lightest background ==>> #ECECEC on mostly #E8E8E8
lighter background ==>> #ECECEC on (#E8E8E8 + a bit of #FFFFFF)
less lighter background ==>> #ECECEC on (#FFFFFF + a bit of #E8E8E8)
dark background ==>> #ECECEC on mostly #FFFFFF
In action:
In the image above, all four LinearLayouts (each above a TextView) are identical, with their background set to "#ECECEC". The visual distinction comes from the activity's background, which is a gradient.
So, if you were set the background property for the parent container (root-level LinearLayout in activity_discussionlist.xml) to say, #ECECEC, or any other color of your liking, this problem would be solved. The gradient is what you don't want.

XML listview overlaps elements when setting visibility

I have an xml layout of about 3000 lines, which serves as the layout for a questionnaire type of app. Each page of the questionnaire is inside of a different linear layout and I set the visibility of the linear layouts in code using View.GONE or View.VISIBLE. This way the user can navigate through the pages without loading new intents each time.
However, when I navigate fast through the app (just pressing the next button to go through the screens), some of the elements that are supposed to be View.GONE shows up and overlaps over the VISIBLE items. This only happens with linear layouts that have list views inside of them. For all the other pages.
I can scroll fast through them, but just the ones with list views in the View.GONE elements sometimes shows up when I navigate too fast. How can I fix this ? Let me know if you want code ... however the xml is very large.
T.I.A.
EDIT
This is a sample of my xml code, I have 3000 lines of this repeating in my xml...
<LinearLayout
android:id="#+id/package_normal_samplesblood"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginBottom="70dp"
android:orientation="vertical">
<TextView
android:id="#+id/textview_heading_b1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="23sp"
android:layout_marginLeft="13dp"
android:layout_marginRight="10dp"
android:layout_marginTop="12dp"
android:layout_marginBottom="12dp"
android:textColor="#6f6f6f"
android:layout_gravity="left"
android:text="Blood Samples"/>
<Button
android:id="#+id/button_samples_blood"
android:text="Add Blood Samples"
android:layout_width="fill_parent"
android:layout_height="65dp"
android:textSize="20sp"
android:layout_gravity="center"
android:layout_marginTop="5dp"
android:layout_marginBottom="5dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"/>
<ListView
android:id="#+id/listview_samples_blood"
android:scrollbarSize="0dp"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#ffffff"
android:orientation="vertical"
/>
</LinearLayout>
<RelativeLayout
android:orientation="horizontal"
android:background="#ffffff"
android:layout_width="fill_parent"
android:layout_height="75dp"
android:layout_marginTop="-75dp"
>
<View
android:layout_width="fill_parent"
android:layout_alignParentTop="true"
android:layout_height="1dp"
android:background="#DEDEDE"
android:layout_marginTop="2dp"/>
<ImageButton
android:id="#+id/left9"
android:background="#null"
android:scaleType="fitEnd"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_marginTop="10dp"
android:layout_marginLeft="10dp"
android:layout_width="70px"
android:layout_height="70px"
android:src="#drawable/left"/>
<TextView
android:id="#+id/textview_heading2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="25sp"
android:layout_centerInParent="true"
android:layout_marginTop="10dp"
android:textColor="#6f6f6f"
android:layout_gravity="center"
android:text="RhODISĀ®"/>
<ImageButton
android:id="#+id/right9"
android:background="#null"
android:scaleType="fitEnd"
android:layout_centerVertical="true"
android:layout_alignParentRight="true"
android:layout_marginTop="10dp"
android:layout_marginRight="10dp"
android:layout_width="70px"
android:layout_height="70px"
android:src="#drawable/right"/>
</RelativeLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/package_normal_sampleshair"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_marginBottom="70dp"
android:orientation="vertical">
<TextView
android:id="#+id/textview_heading_b2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="23sp"
android:layout_marginLeft="13dp"
android:layout_marginRight="10dp"
android:layout_marginTop="12dp"
android:layout_marginBottom="12dp"
android:textColor="#6f6f6f"
android:layout_gravity="left"
android:text="Hair Samples"/>
<Button
android:id="#+id/button_samples_hair"
android:text="Add Hair Samples"
android:layout_width="fill_parent"
android:layout_height="65dp"
android:textSize="20sp"
android:layout_gravity="center"
android:layout_marginTop="5dp"
android:layout_marginBottom="5dp"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"/>
<ListView
android:id="#+id/listview_samples_hair"
android:scrollbarSize="0dp"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#ffffff"
android:orientation="vertical"
/>
</LinearLayout>
<RelativeLayout
android:orientation="horizontal"
android:background="#ffffff"
android:layout_width="fill_parent"
android:layout_height="75dp"
android:layout_marginTop="-75dp"
>
<View
android:layout_width="fill_parent"
android:layout_alignParentTop="true"
android:layout_height="1dp"
android:background="#DEDEDE"
android:layout_marginTop="2dp"/>
<ImageButton
android:id="#+id/left10"
android:background="#null"
android:scaleType="fitEnd"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_marginTop="10dp"
android:layout_marginLeft="10dp"
android:layout_width="70px"
android:layout_height="70px"
android:src="#drawable/left"/>
<TextView
android:id="#+id/textview_heading2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="25sp"
android:layout_centerInParent="true"
android:layout_marginTop="10dp"
android:textColor="#6f6f6f"
android:layout_gravity="center"
android:text="RhODISĀ®"/>
<ImageButton
android:id="#+id/right10"
android:background="#null"
android:scaleType="fitEnd"
android:layout_centerVertical="true"
android:layout_alignParentRight="true"
android:layout_marginTop="10dp"
android:layout_marginRight="10dp"
android:layout_width="70px"
android:layout_height="70px"
android:src="#drawable/right"/>
</RelativeLayout>
</LinearLayout>
And then this is a sample of how I show and hide the linear layouts in code, this repeats for 24 left buttons and 24 right buttons:
left24.setOnClickListener(new View.OnClickListener()
{
public void onClick(View v)
{
package_normal_welcomescreen.setVisibility(View.GONE);
package_normal_package_details.setVisibility(View.GONE);
package_normal_openbag.setVisibility(View.GONE);
package_normal_kitnumber.setVisibility(View.GONE);
package_normal_emptybag.setVisibility(View.GONE);
package_normal_gpscoordinates.setVisibility(View.GONE);
package_normal_image_scene.setVisibility(View.GONE);
package_normal_samplesblood.setVisibility(View.GONE);
package_normal_sampleshair.setVisibility(View.GONE);
package_normal_samplestissue.setVisibility(View.GONE);
package_normal_sampleshorn.setVisibility(View.GONE);
package_normal_samplesother.setVisibility(View.GONE);
package_normal_packsamples.setVisibility(View.GONE);
package_normal_returnbag.setVisibility(View.GONE);
package_normal_sealreturnbag.setVisibility(View.GONE);
package_normal_image_sealedbag.setVisibility(View.GONE);
package_normal_scanned.setVisibility(View.GONE);
package_normal_animal_details.setVisibility(View.GONE);
package_normal_animal_horn_details.setVisibility(View.GONE);
package_normal_animal_ears.setVisibility(View.GONE);
package_normal_area_details.setVisibility(View.GONE);
package_normal_collecter_details.setVisibility(View.GONE);
package_normal_additional_information.setVisibility(View.GONE);
package_normal_owner_details.setVisibility(View.VISIBLE);
package_normal_owner_details.bringToFront();
}
});
right24.setOnClickListener(new View.OnClickListener()
{
public void onClick(View v)
{
if(Session.signatureIsCaptured)
{
package_normal_welcomescreen.setVisibility(View.GONE);
package_normal_package_details.setVisibility(View.GONE);
package_normal_openbag.setVisibility(View.GONE);
package_normal_kitnumber.setVisibility(View.GONE);
package_normal_emptybag.setVisibility(View.GONE);
package_normal_gpscoordinates.setVisibility(View.GONE);
package_normal_image_scene.setVisibility(View.GONE);
package_normal_samplesblood.setVisibility(View.GONE);
package_normal_sampleshair.setVisibility(View.GONE);
package_normal_samplestissue.setVisibility(View.GONE);
package_normal_sampleshorn.setVisibility(View.GONE);
package_normal_samplesother.setVisibility(View.GONE);
package_normal_packsamples.setVisibility(View.GONE);
package_normal_returnbag.setVisibility(View.GONE);
package_normal_sealreturnbag.setVisibility(View.GONE);
package_normal_image_sealedbag.setVisibility(View.GONE);
package_normal_scanned.setVisibility(View.GONE);
package_normal_animal_details.setVisibility(View.GONE);
package_normal_animal_horn_details.setVisibility(View.GONE);
package_normal_animal_ears.setVisibility(View.GONE);
package_normal_area_details.setVisibility(View.GONE);
package_normal_owner_details.setVisibility(View.GONE);
package_normal_collecter_details.setVisibility(View.GONE);
package_normal_additional_information.setVisibility(View.VISIBLE);
package_normal_additional_information.bringToFront();
}
else
{
Toast.makeText(Screen_Package_Normal.this, "Authorized Signature Required", Toast.LENGTH_LONG).show();
}
}
});
I have different types of listviews and adapters, custom and android built in. I don't think the problem lies with the adapter since it works pretty well displaying the listviews and the problem occurs even before the listviews are populated...
I have a temporary fix, not sure how correct this is as an answer, but this fixed my problem... I applied this to my entire layout, and it adds an animation when I hide and show layouts, thus slowing them down a bit, removing the overlapping elements from showing up.
This is what I added to my layout:
android:animateLayoutChanges="true"

Black bands on custom dialogs

I'm customizing an alert dialog, with a different UI. Here is an example.
As you can see there are two black bands (highlighted with red rectangulars) I would like to remove.
It weird because the main layout show match the parent one, as you can see from the xml below.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/lytDialog_takeNowDialog"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="#dimen/default_side_space"
android:layout_marginRight="#dimen/default_side_space"
android:background="#color/yellow"
android:orientation="vertical" >
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="top|center_horizontal"
android:gravity="center"
android:padding="#dimen/default_side_space"
android:text="Are you sure?"
android:textColor="#color/dialog_text_color"
android:textSize="#dimen/dialog_text_size" />
<LinearLayout
android:id="#+id/lytShowAlert_takeNowDialog"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/black_gradient"
android:orientation="horizontal"
android:padding="#dimen/default_side_space" android:visibility="gone">
<CheckBox
android:id="#+id/chkShowAlert_takeNowDialog"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="5dp"
android:text="#string/dont_show_alert"
android:textColor="#android:color/white"
android:textSize="#dimen/dialog_yes_no_size" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="1" >
<Button
android:id="#+id/no_dialog"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="#dimen/space_among_buttons"
android:layout_weight=".5"
android:background="#drawable/yellow_gradient"
android:padding="#dimen/default_side_space"
android:text="No"
android:textColor="#color/dialog_text_color"
android:textSize="#dimen/dialog_yes_no_size" />
<Button
android:id="#+id/yes_dialog"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_margin="#dimen/space_among_buttons"
android:layout_weight=".5"
android:background="#drawable/yellow_gradient"
android:padding="#dimen/default_side_space"
android:text="Yes"
android:textColor="#color/dialog_text_color"
android:textSize="#dimen/dialog_yes_no_size" />
</LinearLayout>
Anyone knows the solution to remove them please?
If you want to remove black panel, change the appTheme(Actually dialog theme.).
Dialog with transparent background in Android

Categories

Resources