Removing ImageView border - android

I have a vertically oriented LinearLayout that has a child LinearLayout that includes a TextView, an EditText, and a Button, and a child ImageView.
So something like:
<LinearLayout>
<LinearLayout>
<TextView>
<EditText>
<Button>
<ImageView>
And the problem I am experiencing is that the seperation between the LinearLayout and the ImageView (displaying a .png as a background with android:background="#drawable/sun") is displaying a visible crease in between them. I have the LinearLayout using the same background color as the .png so that it looks like they flow together, but the crease ruins that aspect.
Edit: Here's a screenshot!
Do you see the thin line under the submit button?
Here is the xml:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#color/lightblue"
>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/welcome"
android:textSize="17sp"
android:textColor="#color/black"
/>
<EditText
android:id="#+id/entry"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:hint="#string/hint_text"
android:textSize="25sp"
android:inputType="text"
/>
<Button
android:id="#+id/submitButton"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textSize="25sp"
android:text="Submit"
/>
<FrameLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:paddingTop="0px"
>
<ImageView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/sunclouds"
android:layout_marginBottom="20dip"/>
<TextView
android:id="#+id/marq"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="10dip"
android:layout_gravity="center_horizontal|bottom"
android:textColor="#color/black"
android:text="#string/provider"
android:marqueeRepeatLimit="marquee_forever"
android:ellipsize="marquee"
android:focusable="true"
android:focusableInTouchMode="true"
android:singleLine="true"
android:scrollHorizontally="true"
/>
</FrameLayout>
</LinearLayout>
How can I fix this?
(side note, my sun and cloud have rough edges, any quick fixes with gimp?)

As a reference for someone who does not have the patience to go through the comments, the real problem was that the exported image had a thin line which the OP had corrected. In any case, the following are the list of reasons why this could happen:
The exported image has a thin line - This can usually be solved by drawing a small rectangle over the line. If not, then slice a 1px version of the image and put it on top of this line to cover it up. It generally works fine.
When exporting if you set the line color - To solve this remove the line color. Either set it to the same color as the image or remove it altogether.

Related

Android Increasing View's Layout Weight Decreases Actual Width

I've tried to track down what's going wrong here, and I'm coming up with nothing. If i change my layout weight from 1 to 2, on the first view in my horizontal linear layout, the resulting width actually decreases. Here is the code.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:weightSum="7">
<TextView android:id="#+id/filterButton"
android:layout_width="0dp"
android:layout_weight="2"
android:layout_height="wrap_content"
android:padding="0dp"
android:textColor="#android:color/white"
android:text="filter"></TextView>
<RelativeLayout
android:layout_width="0dp"
android:layout_weight="4"
android:layout_height="fill_parent"
android:gravity="center" >
<AutoCompleteTextView
android:id="#+id/editText1"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:ems="14"
android:imeOptions="actionDone"
android:inputType="textAutoComplete|textAutoCorrect"
android:textColor="#FFFFFF"
android:singleLine="true"
android:gravity="left">
</AutoCompleteTextView>
<ImageView android:id="#+id/clear"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:src="#drawable/close"
android:layout_alignParentRight="true"
android:scaleType="fitEnd"
android:adjustViewBounds="true"
android:padding="12dp"
android:visibility="invisible"
android:tint="#android:color/white"/>
</RelativeLayout>
<ImageView android:id="#+id/listButton"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="fill_parent"
android:src="#drawable/list"
android:scaleType="fitCenter"
android:adjustViewBounds="true"
android:padding="9dp"
android:tint="#android:color/white"></ImageView>
</LinearLayout>
Here is what my action bar looks like with the TextView's layout weight set to 1.
You can see I'm already getting some overflow on the right element. It's getting bumped off screen. Here is what it looks like with the TextView's weight set to 2.
Which is odd because the TextView has actually decreased in size. Here is the action bar without the TextView. The sizes are behaving well here.
Any help would be greatly appreciated!
It looks similar to problem i have sometimes.
For layout with weight 7 it would give space like that [[..2..][.5]].
Like in your example making weight smaller actually give more space for layout.
Try to change background color of the middle layout to have better grasp what space exacly is given to your layouts.
Unlucky on my computer your code works normally so I can't help more than that.

Footer view as RelativeLaout

I have a RelativeLayout which includes following RelativeLayout:
<RelativeLayout
android:id="#+id/buttons_bar"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:paddingTop="10dip" >
<Button
android:id="#+id/day_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="day"
android:layout_alignParentLeft="true"
android:textSize="14sp"/>
<Button
android:id="#+id/month_button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="month"
android:layout_alignParentRight="true"
android:textSize="14sp"/>
<EditText
android:id="#+id/week_button"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/day_button"
android:layout_toLeftOf="#id/month_button1"
android:maxLines="5"
android:minLines="1"
android:textSize="16sp"
android:layout_marginBottom="15dp"/>
</RelativeLayout>
This layout will be shown as a footer for the page.
As you see the maxLines for EditText is 5. When the line size is more than 2 in EditText, buttons around it start to move a bit up.
I want buttons stick to the end of page and do not move. Any solution?
I tried adding android:layout_alignParentBottom="true" for buttons but it did not work.
Try to add android:layout_alignParentBottom="true" for all child elements.
It works at least in Android Studio.
UPDATED
Add android:layout_alignBottom="#+id/week_button" for both buttons.
it sounds to be as a bug in the UI framework, but there's usually work around to achieve the same visual effect.
For example, replacing this RelativeLayout you show in the XML to a LinearLayout with orientation="horizontal" should give the same visual effect.
pseudo code
<LinearLayout horizontal>
<Button wrap_content layout_gravity=bottom/>
<EditText width=0dp weight=1/> // makes EditText fill remaining space
<Button wrap_content layout_gravity=bottom/>
</LinearLayout>

Android Nested LinearLayout, Gravity not having expected results

Having a problem with nested LinearLayouts to use as a custom row in a ListView.
App is a kind of internal corporate phone book and this row will be repeated in the ListView.
The "Details Witheld" on the right looks fine when gravity is set to left for it, but if gravity is set to center then it appears half off the page.
I'd guess my parent LinearLayout is too wide for the screen but it's set as fill_parent so I don't see how.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
Full XML source is below.
Aligned Left looks like this and I'd like Details to be a space in so it's centered above the Witheld.
Aligned Center looks like this
Full XML Source
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<!-- Left side name & post / parish -->
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="80"
android:orientation="vertical" >
<TextView
android:id="#+id/txtrowname"
android:layout_marginBottom="2dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Smtih, Mr John"
android:textSize="24sp"
android:textColor="#color/darkblue_text"
android:textStyle="normal" />
<TextView
android:id="#+id/txtrowpost"
android:layout_marginBottom="2dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="12 Some Street, SomeTown. SS11 1SS"
android:textSize="12sp"
android:textColor="#000000"
android:textStyle="normal" />
</LinearLayout>
<!-- Details withheld on right -->
<TextView
android:id="#+id/txtrowwitheld"
android:layout_width="0dp"
android:layout_height="fill_parent"
android:text="Details Witheld"
android:layout_weight="20"
android:textSize="18sp"
android:gravity="center"
android:lines="2"
android:maxLines="2"
android:textColor="#FF0000"
android:layout_marginBottom="2dp"
android:textStyle="normal" />
</LinearLayout>
Image with layout_gravity as suggested by Ramesh
try layout_gravity in place of gravity that will work and dont use line="2". it will automatically fit into 2 lines if width exceeds.
I ended up just making do without it being centered.

Center multiple items in a RelativeLayout without putting them in a container?

I have a RelativeLayout containing a pair of side-by-side buttons, which I want to be centered within the layout. I could just put the buttons in a LinearLayout and center that in the RelativeLayout, but I want to keep my xml as clean as possible.
Here's what I tried, this just puts the "apply" button in the center and the "undo" button to the left of it:
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginTop="15sp">
<TextView
android:id="#+id/instructions"
android:text="#string/instructions"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="15sp"
android:layout_centerHorizontal="true"
/>
<Button
android:id="#+id/apply"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="#string/apply"
android:textSize="20sp"
android:layout_below="#id/instructions"
/>
<Button
android:id="#+id/undo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="#string/undo"
android:textSize="20sp"
android:layout_toLeftOf="#id/apply"
android:layout_below="#id/instructions"
/>
</RelativeLayout>
android:gravity will align the content inside the view or layout it is used on.
android:layout_gravity will align the view or layout inside of his parent.
So adding
android:gravity="center"
to your RelativeLayout should do the trick...
Like this:
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:layout_marginTop="15sp">
</RelativeLayout>
Here is an extension of BrainCrash's answer. It is a non nested option that groups and centers all three horizontally and vertically. In addition, it takes the top TextView and centers it horizontally across both buttons. If desired, you can then center the text within the TextView with android:gravity="center". I also removed the margins, added color, and set the RelativeLayout height to fill_parent to highlight the layout. Tested on API 11.
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center"
android:background="#android:color/black"
>
<TextView
android:id="#+id/instructions"
android:text="TEST"
android:textSize="20sp"
android:background="#android:color/darker_gray"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_alignLeft="#+id/undo"
android:layout_alignRight="#+id/apply"
android:gravity="center"
/>
<Button
android:id="#+id/apply"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="APPLY"
android:textSize="20sp"
android:layout_below="#id/instructions"
/>
<Button
android:id="#+id/undo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:text="UNDO"
android:textSize="20sp"
android:layout_toLeftOf="#id/apply"
android:layout_below="#id/instructions"
/>
</RelativeLayout>
android:layout_gravity="center"
will almost give what you're looking for.
Here is a combination of the above answer's that solved my specific situation:
Centering two separate labels within a layout that also includes a button in the left most position of the same layout (button, label, label, from left to right, where the labels are centered relative to the layout containing all three views - that is, the button doesn't push the labels off center).
I solved this by nesting two RelativeLayout's, where the outer most layout included the
Button and an Inner-RelativeLayout.
The Inner-RelativeLayout contained the two text labels (TextView's).
Here is a snippet that provides the details of how the centering and other layout stuff was done:
see: RelativeLayout Gravity not applied? and
Gravity and layout_gravity on Android
for the difference's between gravity and layout_gravity.
Tweak the paddingLeft on the btn_button1 Button to see that the TextView's do not move.
(My apologies to havexz for the downvotes. I was too hasty in thinking that just b/c your suggestions didn't solve the exact question being ask, that they do help to solve very similar situations (the answer here solves a very specific situation, and only the combination of all these answer's solved my problem. I tried upvoting, but it won't let me unless I edit the answer's, which I don't want to do.)
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/rl_outer"
android:layout_width="fill_parent"
android:layout_height="50dip"
android:background="#FF0000FF">
<Button
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/btn_button1"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:background="#FF00FF00"
android:text="<"
android:textSize="20sp"
android:paddingLeft="40dip"/>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/rl_inner"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:background="#FFFF00FF"
android:layout_centerInParent="true"
android:gravity="center">
<TextView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/tv_text1"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:background="#FF505050"
android:textSize="20sp"
android:textColor="#FFFFFFFF"
android:text="Complaint #"
android:gravity="center"/>
<TextView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/tv_text2"
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:background="#FF505050"
android:textSize="20sp"
android:textColor="#FFFFFFFF"
android:layout_toRightOf="#id/tv_text1"
android:gravity="center"/>
</RelativeLayout>
</RelativeLayout>
LinearLayout is a good option. Other than that there are options like create an invisible view and center that and then align left button to the left it and right on the right of it. BUT those are just work arounds.

Centering a TextView while keeping it to the right of a button?

I'm pretty sure I've done this before, but I've forgotten how.
Here's the problem:
I've got a button and a textview, and I want the textview to be centered, while the button is on the left side.
No problem? Just put them in a relativelayout, make the textview centerinparent, and the button alignparentleft.
But now I'm going to dynamically change the text, so it can potentially be written on top of the button! I'll just add toRightOf="#id/button" on the textview. No, now it's no longer centered.
I wish I could provide a screenshot, but it seems the computer is out of memory and can't do that.
Here's some code: http://pastebin.com/3N70Vjre (Since I can't paste xml...?)
<RelativeLayout
android:id="#+id/header"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true">
<Button
android:id="#+id/leftbutton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:text="text!"
/>
<TextView
android:id="#+id/toptext"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#android:color/white"
android:layout_toRightOf="#id/leftbutton"
android:layout_centerInParent="true"
android:textSize="16sp"
android:textStyle="bold"
android:text="Text!"
android:singleLine="true"
/>
</RelativeLayout>
Try this (unfortunately I'm at work so can't jump into Eclipse to get you some code) -
Change the layout_width of the TextView to fill_parent.
Set the gravity of the TextView to center (so the text centers inside the TextView)
Set the layout_weight of the Button to 1 and the layout_weight of the TextView to 2. Note that you may have to fudge with these numbers to get the layout you're looking for.
This should center the text of the TextView after the Button, though it will not center the TextView itself. You can accomplish that by replacing the TextView with a container (Linear/Relative Layout) and doing the same method as above on the Layout instead of the TextView. You would then put your TextView inside the container and set the container's gravity to "center".
Hope this helps point you in the right direction :)
You can try this (pseudo-code):
<RelativeLayout>
<Button>
<LinearLayout toLeftOf="toptext" type="horizontal">
<TextView gravity="center">
</LinearLayout>
</RelativeLayout>
You might have to have the LinearLayout as width="fill_parent". Not sure if that will work nor not. You can subsequently try some of the things listed here: http://thinkandroid.wordpress.com/2010/01/14/how-to-position-views-properly-in-layouts/
Try declaring the TextView first, then aligning the button to the left of the text view. Keep in mind you may run into issues if the TextView becomes too wide.
EDIT: I see, so you're trying to do something sort of like the iPhone's header with back/next buttons (similar anyway). Try this modification. I still believe you're going to run into issues if the TextView gets large enough to hit the Button, though.
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/header"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
>
<TextView
android:id="#+id/toptext"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#android:color/white"
android:layout_alignParentCenter="true"
android:textSize="16sp"
android:textStyle="bold"
android:text="Text!"
android:singleLine="true"
/>
<Button
android:id="#+id/leftbutton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:text="text!"
/>
</RelativeLayout>
Try this FrameLayout instead. This may do more what you're expecting:
<FrameLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<TextView
android:id="#+id/toptext"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:textColor="#android:color/white"
android:textSize="16sp"
android:textStyle="bold"
android:text="Text!"
android:singleLine="true"
/>
<Button
android:id="#+id/leftbutton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Text!"
/>
</FrameLayout>

Categories

Resources