I have a problem with the button position in Android Studio - android

I'm making an app in Android Studio, my problem is the position on the button. In the layout the position is correct, but in the simulator the button is in the left corner.
Example:
Design
Simulator
My code:
<androidx.appcompat.widget.AppCompatButton
android:id="#+id/btn1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#F10000"
android:onClick="onClick"
android:text="INICIO"
android:textColor="#000000"
tools:layout_editor_absoluteX="161dp"
tools:layout_editor_absoluteY="622dp />

the tools keyword in your Button is just to show in layout and nothing more, for define the position of the button you should rely on your button parent,for example if its LinearLayout you can change the position of button by giving it android:layout_gravity
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:id="#+id/parent">
<androidx.appcompat.widget.AppCompatButton
android:id="#+id/btn1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#F10000"
android:onClick="onClick"
android:text="INICIO"
android:textColor="#000000"
android:layout_gravity="center" />
</LinearLayout>

Related

Android Studio add Switch to the left side of a textview in XML

Similarly to adding an icon to the left of a textview using android:drawableleft="...", I want to do something similar except with a predefined switch in the same XML file. How do I go by doing this?
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<Switch
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/switch" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Switch Text" />
</LinearLayout>
In case of Radio Buttons or Checkbox you can always use something like this
android:button="#null"
android:drawableRight="?android:attr/listChoiceIndicatorMultiple"

Align layout item to the right and RTL on Android

I'm trying to put three items in horizontal align using this code
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="right"
android:layout_gravity="right"
android:layout_marginTop="10dp"
android:orientation="horizontal">
<ImageView
android:layout_width="20dp"
android:layout_height="20dp"
android:layout_marginLeft="10dp"
android:src="#drawable/address"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textStyle="bold"
android:text="#string/lbl_address"/>
<TextView
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:id="#+id/txtAddress" />
</LinearLayout>
The problem is gravity never worked, the ImageView always starts from the left and other items follows in the same order.
I have tried to reverse item orders in the code which will work on none RTL languages, but my application targets both, so it shows wrong on RTL supported devices.
Also I have tried RelativeLayout but items come over each other.
Note: All languages should start from right to left, this is my desired behavior
Add this attribute to your root LinearLayout tag:
android:layoutDirection="rtl"
This will make your view lay out as though the user had chosen a right-to-left language, regardless of what language they've actually chosen.
Try to use this code in AndroidManifest.xml
android:supportsRtl="true"
For support languages that start from right in app.
Because you use android:layout_width="0dp" android:layout_weight="1" in your code .The TextView will use the rest of space .So the left image will on the left .So you can remove android:layout_weight="1" and change the width of TextView .
You can change
<TextView
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:id="#+id/txtAddress" />
to
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:id="#+id/txtAddress" />
Note
If you want to change the location of the LinearLayout's item .You can use android:gravity="right" .
If you want to change the location of the LinearLayout ,you can use android:layout_gravity="right" .
And you code is android:layout_width="match_parent" , so the android:layout_gravity="right" has no effect .
And you can use android:layoutDirection="rtl" in your LinearLayout
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="right"
android:layout_gravity="right"
android:layout_marginTop="10dp"
android:orientation="horizontal"
android:layoutDirection="rtl"
xmlns:android="http://schemas.android.com/apk/res/android">

Unable to see completed view layout in Android Studio

I am creating a vertical LinearLayout that will be displayed in a vertical ScrollView. I can't find a way in Android Studio to see the portion of the LinearLayout that is below the bottom of the ScrollView. Is there any way to see the full layout rather than constraining it to the viewport provided by the renderer?
Like Drew said, creating a user defined device definition has been the only solution which worked for me. Below i show you the steps to follow:
Step 1)
Within the preview-pane, open the Virtual Device Selection drop-down and select Add Device Definition..
Step 2)
Within the Your Virtual Devices dialog click the Create Virtual Device button.
Step 3)
Within the Select Hardware dialog click the New Hardware Profile button.
Step 4)
Within the Configure Hardware Profile dialog specify (f.e.) a Resolution of 720 x 4000 px and a Screensize of 12 inch. Also setting the Screensize results in a density of xhdpi (thanks to Mete).
Step 5) Close all dialogs and restart Android Studio.
Step 6) Open the Virtual Device Selection drop-down. The new user defined hardware profile can be found under Generic Phones and Tablets.
I've just discovered how. You need to create a user defined device definition in Android AVD - I created one that was 480 x 4000 pixels. Exit and restart Android Studio and then you can select this device in the preview renderer and can see 4000 pixels worth of LinearLayout.
Found a easier solution, in your layout add something like below and adjust as you need:
android:layout_marginTop="-1500dp"
in new version of android studio (i don't know from which version, but i'm using latest 2.3.3 now) you can resize your preview layout by drag it
Android Studio will offer a toggleable full view, if the ScrollView is the root of the layout. I had put mine on top of the default RelativeLayout and had to manually fix that in the XML before the GUI would give me the full view.
I hope the screenshot help you :
You can use scrollY attribute to scroll the ScrollView in the preview. Using scrollY attribute with tools namespace will only scroll the view in the display and not in the actual app. And make sure you use px as the unit with scrollY attribute.
tools:scrollY="150px"
Update: Now you can scroll a ScrollView directly inside preview panel
(I tested on Android studio version 2.3.2)
Short answer: Right click on your ScrollView and select Refactor > Extract > Layout.
Android-studio will extract your ScrollView into a new layout file and put tools:showIn="#layout/original_layout_file" attribute at root layout(your ScrollView).
Note: Android-studio will preview full layout if root layout is ScrollView.
In Android Studio version 3.2.1 you can select "Custom" device on preview panel and then resize preview to whatever height you need.
click on the scrollView in conponent tree (on the right)
click on the new button wich appears on the left (second row of toolbar)
Another quick alternative solution is to hide the layouts temporarily at the top so that the layouts at the bottom can appear in the visible window in Android Studio.
Put android:visibility="gone" on the layouts that you want to hide.
Example:
<HorizontalScrollView
android:visibility="gone"
android:id="#+id/hsv02"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignStart="#+id/ll24"
android:layout_below="#+id/ll199">
</HorizontalScrollView>
I might be late but it'll be a lot easier for you to just set the margins to negative to shift the scroll view to the left.
For example:
margin:
left: -100px
Now you can see and edit the scrollview however you like!
TABLE LAYOUT
<?xml version="1.0" encoding="utf-8"?>
<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:stretchColumns="1">
<TableRow android:padding="5dip">
<TextView
android:layout_height="wrap_content"
android:text="New Product Form"
android:typeface="serif"
android:layout_span="2"
android:gravity="center_horizontal"
android:textSize="20dip" />
</TableRow>
<TableRow>
<TextView
android:layout_height="wrap_content"
android:text="Product Code:"
android:layout_column="0"/>
<EditText
android:id="#+id/prod_code"
android:layout_height="wrap_content"
android:layout_column="1"/>
</TableRow>
<TableRow>
<TextView
android:layout_height="wrap_content"
android:text="Product Name:"
android:layout_column="0"/>
<EditText
android:id="#+id/prod_name"
android:layout_height="wrap_content"
android:scrollHorizontally="true" />
</TableRow>
<TableRow>
<TextView
android:layout_height="wrap_content"
android:text="Product Price:" />
<EditText
android:id="#+id/prod_price"
android:layout_height="wrap_content" />
</TableRow>
<TableRow>
<Button
android:id="#+id/add_button"
android:text="Add Product"
android:layout_height="wrap_content" />
<Button
android:id="#+id/cancel_button"
android:text="Cancel"
android:layout_height="wrap_content" />
</TableRow>
</TableLayout>
GridLAYOUT
<?xml version="1.0" encoding="utf-8"?>
<GridLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/GridLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:columnCount="3"
android:rowCount="2"
tools:context=".Main3Activity" >
<Button
android:id="#+id/button3"
android:layout_column="0"
android:layout_gravity="fill_horizontal"
android:layout_row="0"
android:text="Button"
/>
<Button
android:id="#+id/button1"
android:layout_column="1"
android:layout_gravity="fill_horizontal"
android:layout_row="0"
android:text="Button" />
<Button
android:id="#+id/button2"
android:layout_column="2"
android:layout_gravity="fill_vertical"
android:layout_row="0"
android:layout_rowSpan="2"
android:text="Button" />
<Button
android:id="#+id/button4"
android:layout_column="0"
android:layout_columnSpan="2"
android:layout_gravity="fill_horizontal"
android:layout_row="1"
android:text="Button" />
</GridLayout>
ANOTHER TABLE LAYOUT
<?xml version="1.0" encoding="utf-8"?>
<android.widget.TableLayout 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:layout_width="match_parent"
android:layout_height="match_parent"
android:stretchColumns="1"
tools:context="com.example.dhanya.uitablelayout.MainActivity">
<TableRow
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<TextView
android:text="Time"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="0" />
<TextClock
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/textClock"
android:layout_column="1" />
</TableRow>
<TableRow>
<TextView
android:text="First Name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="0" />
<EditText
android:width="200px"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</TableRow>
<TableRow>
<TextView
android:text="Last Name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_column="0" />
<EditText
android:width="100px"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</TableRow>
<TableRow
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<RatingBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_span="2"
android:id="#+id/ratingBar"
android:layout_column="0" />
</TableRow>
<TableRow
android:layout_width="fill_parent"
android:layout_height="fill_parent"/>
<TableRow
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Submit"
android:layout_span="2"
android:id="#+id/button"
android:layout_column="0" />
</TableRow>
</android.widget.TableLayout>
The best I found is to set the device to custom. Then we can change the layout simply by dragging.
My layout is long and need to scroll layout even using the vertical long resolution and when I set the layout editor to high resolutions, the screen does not scroll completely and smoothly
By setting the layout to
3.2_HVGA_slider_ADP1_API_27, the screen scrolled and my problem was solved

Button size and padding within RelativeLayout

I'm attempting to create a a Heading + button similar to the Google Music App, e.g. where there is a "Songs" Header on the Left and then on the right there is a Button with the text "X more"..
I've using a RelativeLayout for the TextView and Button
My problem is that the button is taking up the size of the layout that contains the text the height is all wrong and the padding doesn't seem to do anything.
<ScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
[REMOVED for clarity]
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/list_foreground"
android:orientation="vertical" >
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="10dp"
android:text="#string/photos"
android:textAppearance="?android:attr/textAppearanceMedium" />
<Button
android:id="#+id/photo_button"
style="?android:attr/buttonStyleSmall"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:background="#color/actionbar_background"
android:padding="10dp"
android:text="test" />
</RelativeLayout>
What am I doing wrong here?
RelativeLayouts are designed to have children in the layout "relative" to each other. In other words, if you want the Button to the right of the Textview, you need to tell it.
Because you are aligning relative to the parent LEFT / RIGHT, it appears that things are "kind of" working.
You may be better off with a LinearLayout, depending on your needs. LinearLayouts use "orientation" not RelativeLayouts.
You should look over some tutorials (like this one: http://mobile.tutsplus.com/tutorials/android/android-layout/) but ultimately you will probably put your button in first and then your text view so that the textview content will wrap appropriately.
To get the same effect as the Music App I ended up using a RelativeLayout but instead of a Button I'm using another TextView, this is giving the impression it's a button but it gives me more scope to format the background etc. I think just setup a OnClickListener in the code
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/photo_title">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginLeft="10dp"
android:text="#string/photos"
android:textAppearance="?android:attr/textAppearanceLarge" />
<TextView
android:id="#+id/more_photo_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="10dp"
android:background="#color/actionbar_background"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:text="10 MORE"
android:textColor="#color/button_text"
android:textSize="12sp" />
</RelativeLayout>

Android - Button disappear from the layout when it has transparent background

I have following Table in my Android app. Everything works, except the last button - about me. When I set background to transparent color - it is not beign display on my device (however, it is visible on the graphical view of the layout in the eclipse. By "not display" I mean, that it is not on the screen - on its place its "next". If I remove android:background from the last button - it comes back to device. Whats wrong?
<TableRow
android:id="#+id/tableRow1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<ImageButton
android:id="#+id/buttonShare"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/transparent"
android:onClick="shareIt"
android:src="#drawable/social_share" />
<ImageButton
android:id="#+id/buttonBack"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/transparent"
android:onClick="prevImage"
android:src="#drawable/navigation_previous_item" />
<ImageButton
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/transparent"
android:src="#drawable/navigation_accept" />
<ImageButton
android:id="#+id/buttonAbout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/transparent"
android:onClick="showAbout"
android:src="#drawable/action_about" />
<ImageButton
android:id="#+id/buttonForward"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/transparent"
android:onClick="nextImage"
android:src="#drawable/navigation_next_item" />
<ImageButton
android:id="#+id/buttonAbout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#color/transparent"
android:onClick="showAbout"
android:src="#drawable/action_about" />
</TableRow>
</TableLayout>
Part of my color resource is like below:
<color name="transparent">#00000000</color>
I just loaded overwrited action_about.png picture with new one. Now, the button appears - but it shows old png, about, not the new one. What is going on?
Why are you trying to set the background to transparent? Do you just want a button that does not have the device default button "frame" and instead has only your action_about drawable? If so you can do that with a normal Button instead of ImageButton like so:
<Button
android:id="#+id/buttonAbout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/action_about"
android:onClick="showAbout"/>
EDIT: Also note that you have the buttonAbout element twice in your layout, it is at the bottom, and 3 from the bottom.
EDIT 2: Do you not have a clean... option at all under the Project menu at the top? or is it just grayed out?
I downloaded Eclipse Indigo sr2 (I can't find link on the site for sr1) and It is there for me.

Categories

Resources