Why am I getting a gray border around my image button? - android

I want to display the image as the button, but when I use ImageButton, it displays a gray border around button. I want it to be all black so that it looks like it's just the flashlight in the image! Any ideas? (The image file is just a PNG file)
Here's my fragment_display_message.xml:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin"
tools:context="com.example.myfirstapp.DisplayMessageActivity$PlaceholderFragment"
android:gravity="center_horizontal"
android:orientation="vertical"
android:weightSum="1"
android:background="#color/black" >
<TextView
android:id="#+id/text1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/white"
android:layout_gravity="center_horizontal" />
<TextView
android:id="#+id/text2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textColor="#color/white"
android:text="\n It's a bit dark in here,\n don't you think?\n\nLet's light it up by tapping\n the flashlight!\n\n\n"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true" />
<ImageButton
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/flashlight"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true" />
</LinearLayout>

remove these lines from you layout
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin"

It may help to set a the ImageButton Style to Borderless.
style="#style/Widget.AppCompat.Button.Borderless"

use ImageView instead of ImageButton

Related

Custom View with text view is not coming

I am inserting custom view inside a relative layout. The action bar turning into white color
Here is the xml code:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/dark_tablet_converted"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin">
<com.test.myview
android:id="#+id/view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:padding="8dp" />
<TextView
android:id="#+id/text1"
style="?android:attr/listSeparatorTextViewStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:gravity="center_horizontal"
android:text="text : "
android:textSize="15sp"
android:textStyle="bold" />
</RelativeLayout>
and here is the image.
I am not getting where is the problem.
Android support library used
'android support appcompat-v7:23.0.1'
'android.support v4:23.0.1'
targetSdkVersion 23
compileSdkVersion 23
buildToolsVersion '23.0.1'
EDIT:
Whatever placed above my view will get displayed. only if any layout/view is placed below my customview will get vanished.
your views are child of relative layout
so, they are drawed one on the other
and you can't really decide who will be in foreground and who will be in background
add a framelayout as parent of your custom and text view
then, in your code, find your textview and call "bringToFront"
try this,
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/dark_tablet_converted"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin">
<com.test.myview
android:id="#+id/view"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_alignParentRight="true"
android:layout_alignParentLeft="true"
android:layout_gravity="center"
android:padding="8dp" />
<TextView
android:id="#+id/text1"
style="?android:attr/listSeparatorTextViewStyle"
android:layout_below="#+id/view"
android:layout_width="match_parent"
android:layout_marginTop="10dp"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:gravity="center_horizontal"
android:text="text : "
android:textSize="15sp"
android:textStyle="bold" />
</RelativeLayout>

Android: How to create a specific horizontal linear layout

I am making an app where there is a custom search bar. I want there to be a search part that is big, a spinner for region selection that is a small square, and a search button that is also a small square.
Here is what I am talking about.
The code I have right now is this:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
android:layout_height="match_parent" android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin" tools:context=".MainActivity">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
>
<EditText
android:hint="#string/summoner_name"
android:layout_width="wrap_content"
android:layout_weight="75"
android:layout_height="wrap_content"
android:id="#+id/summoner_name"/>
<Spinner
android:layout_weight="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/regions">
</Spinner>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:id="#+id/search_button"/>
</LinearLayout>
However, this makes the search half the screen, and the button for 2/5's the screen, and the spinner for a smaller ammount. Anyone know how to accomplish this?
Thanks :)
give weight 1 to EditText android:layout_weight="1" , and remove weight tags from other components.
Also you will require to set Spinners width statically, if above doesnt work because of Spinner's width part
like this?
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent"
android:layout_height="match_parent" android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin" tools:context=".MainActivity"
android:orientation="vertical">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<EditText
android:layout_width="wrap_content"
android:layout_weight="75"
android:layout_height="wrap_content"
android:id="#+id/summoner_name"/>
<Spinner
android:layout_weight="1"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:id="#+id/regions"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:id="#+id/search_button"/>
</LinearLayout>
</LinearLayout>

Android Studios - Adjusting VideoView Size in Layout Editor

I've only ever seen questions asking how to full screen the VideoView but what I'm trying to do is have a video playing as only a part of the activity, with some additional elements on the page. How would I go about doing that? It doesn't seem that I have control of the size of the VideoView, I can only shift it around in the designer.
Edit: Additional Info
<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:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin"
tools:context="com.MyActivity">
<Button
Default button Stuff
/>
<TextView
Default textview stuff
/>
<VideoView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/videoView"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="50dp"
android: />
</RelativeLayout>
As far as ideal proportions go, maybe something like 500 x 400 dp? I can play with numbers after I understand the process.
If I understand you correctly, this is something that you'd want:
<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:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:paddingBottom="#dimen/activity_vertical_margin"
tools:context="com.MyActivity">
<LinearLayout
android:id="#+id/componentLayout"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:text="Button"
android:layout_height="wrap_content"
android:layout_width="wrap_content" />
<TextView
android:text="This is a placeholder text"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
<VideoView
android:layout_marginTop="20dp"
android:layout_below="#+id/componentLayout"
android:layout_width="300dp"
android:layout_height="400dp"
android:id="#+id/videoView"
android:layout_centerHorizontal="true" />
</RelativeLayout>
You can define the android:layout_width and android:layout_height attributes as you wish. However, they can not exceed the height or width of the parent layout.
Result:
Width: 300dp, Height: 400dp

Android relativeLayout: How to make button take bottom port of screen?

I was wondering can I create a button that would take the bottom portion of the screen as seen here:
I have tried to play with the alignment and margins, but to no avail:
Another question that I had was why my movie poster is not aligning to the left of the top text properly? As can be seen, it's a bit to the right. I had attempted to drag it into place.
Here is my XML:
<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:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context="com.abushawish.randommovie.MainActivity$PlaceholderFragment" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/button1"
android:layout_alignParentTop="true"
android:layout_marginTop="14dp"
android:text="Black Hawk Down"
android:textAppearance="?android:attr/textAppearanceLarge" />
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/textView3"
android:layout_alignLeft="#+id/textView1"
android:layout_below="#+id/textView1"
android:src="#drawable/bhd" />
<Button
android:id="#+id/button1"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:text="New Movie Suggestion"
android:layout_width="match_parent"
android:layout_weight="1"
android:layout_marginLeft="-50dp"
android:layout_marginRight="-50dip"
android:layout_marginBottom= "-20dp" />
<TextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignLeft="#+id/textView1"
android:layout_centerVertical="true"
android:text="Description"
android:layout_marginLeft="1dp" />
Thank you!
Try to remove these.
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
They add padding to the RelativeLayout.
You should start by removing the padding and margins in order to have a simple layout.
When it is ok, you can put back the padding & margins one by one to see which ones are ok or not.
Remove the padding from the buttons parent layout, then your button will align with the edges of the screen.
<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:paddingTop="#dimen/activity_vertical_margin"
tools:context="com.abushawish.randommovie.MainActivity$PlaceholderFragment" >
If you still want to have padding for the other objects add them in a separate layout with padding.
Edit
To put the picture in the middle add
android:layout_centerHorizontal="true"
Try android:gravity="bottom" and in the relative layout add android:layout_alignParentBottom="true"
This will give u the intended look.. and yes, don't give weight to children of RelativeLayout
<Button
android:id="#+id/button1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:text="New Movie Suggestion" />

Android: View not at the right place

I got a little problem: I can't put views to the verry right or to the verry left of my screen... In the graphical layout preview of eclipse, it looks like this:
If I upload it to my Galaxy Tab 3 (10.1"), it looks exactly the same...
Here's the XML-Code:
<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:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
android:id="#+id/layout"
tools:context=".MainActivity" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:gravity="left"
android:text="Large Text"
android:textAppearance="?android:attr/textAppearanceLarge" />
</RelativeLayout>
As you can see, android:layout_alignParentLeft and android:layout_alignParentTop are set to true...
#dimen/activity_vertical_margin and #dimen/activity_horizontal_margin have their default value of 16dp.
It don't concerns just TextViews, but also every other view I tried out. If I select other screen sizes than 10.1", the view is at the right place.
Anybody can help me?
Thank you!
Try this:
<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:id="#+id/layout"
tools:context=".MainActivity" >
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:gravity="left"
android:text="Large Text"
android:textAppearance="?android:attr/textAppearanceLarge" />
You have given padding to the parent layout. That's why you couldn't place your view close to left.
Remove these lines from your RelativeLayout
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
Remove the paddings of your Relative Layout
<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:id="#+id/layout"
tools:context=".MainActivity" >

Categories

Resources