Element always displays at top of the fragment screen. Issue - android

Element is always displaying at top of the screen. I tried different ways to fix but out of luck. I want to place element at any location of the screen. This is fragment screen.
<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"
tools:context="myapp.com.myapp1.fragments.AddPeopleFragment">
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
tools:layout_editor_absoluteX="8dp"
tools:layout_editor_absoluteY="159dp"
android:text="three"
android:layout_alignParentTop="true"
android:layout_alignParentStart="true"
android:layout_marginStart="110dp"
android:layout_marginTop="167dp" />
</FrameLayout>

Have you ever noticed these lines of code ?
"android:layout_alignParentTop="true"
android:layout_alignParentStart="true""
if you want to use absolute layout, do not bother these code;
eg:
<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"
tools:context="myapp.com.myapp1.fragmants.FragmantAddPeople">
<TextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
tools:layout_editor_absoluteX="8dp"
tools:layout_editor_absoluteY="159dp"
android:text="three"
android:layout_marginStart="110dp"
android:layout_marginTop="167dp" />
</android.support.constraint.ConstraintLayout>
you can place the item(which in case is the button) anywhere by changing the dp Value of absoluteX and absoluteY;``

Related

App screen layout not working in landscape orientation

The following code is working properly in portrait orientation, but in landscape orientation, the image is covering the whole screen and none of the other views are showing. which part of the code I have to replace to solve the issue?
Screenshots here https://imgur.com/LNJ95r7 "portrait view"
https://imgur.com/yq1ncnk "landscape view"
<RelativeLayout 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"
tools:context=".MainActivity">
<ImageView
android:id="#+id/resturant_image"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:src="#drawable/resturant"
android:layout_alignParentTop="true"
android:scaleType="centerCrop" />
<TextView
android:id="#+id/resturant_name"
android:layout_below="#id/resturant_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingTop="10dp"
android:paddingLeft="16dp"
android:text="Etarnity Resturant"
android:textSize="30dp"
android:textColor="#android:color/black"
android:textStyle="bold"/>
<TextView
android:id="#+id/resturant_description"
android:layout_below="#id/resturant_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="10dp"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:text="Best food quality in cheapest price.One of the best stores of california. Home delivery available 24x7"
android:textSize="20dp"
android:textColor="#android:color/black" /> </RelativeLayout>
Add ScrollView or NestedScrollView to your layout like below code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
tools:context=".MainActivity">
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/resturant_image"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:src="#drawable/resturant"
android:layout_alignParentTop="true"
android:scaleType="centerCrop" />
<TextView
android:id="#+id/resturant_name"
android:layout_below="#id/resturant_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:paddingTop="10dp"
android:paddingLeft="16dp"
android:text="Etarnity Resturant"
android:textSize="30dp"
android:textColor="#android:color/black"
android:textStyle="bold"/>
<TextView
android:id="#+id/resturant_description"
android:layout_below="#id/resturant_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingTop="10dp"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:text="Best food quality in cheapest price.One of the best stores of california. Home delivery available 24x7"
android:textSize="20dp"
android:textColor="#android:color/black" />
</RelativeLayout>
</ScrollView>
</RelativeLayout>
There Are two ways to solve this problem
First
create different layout for landscape view and inflate at runtime orientation change
Second
For big size layout we have used ScrollView Or NestedScrollView.Some time Layout need more space So in this situation we have used ScrollView
See 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"
tools:context=".MainActivity">
<android.support.v4.widget.NestedScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:paddingBottom="10dp">
<ImageView
android:id="#+id/resturant_image"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:adjustViewBounds="true"
android:src="#drawable/house1" />
<TextView
android:id="#+id/resturant_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/resturant_image"
android:paddingLeft="16dp"
android:paddingTop="10dp"
android:text="Etarnity Resturant"
android:textColor="#android:color/black"
android:textSize="30dp"
android:textStyle="bold" />
<TextView
android:id="#+id/resturant_description"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/resturant_name"
android:paddingLeft="16dp"
android:paddingTop="10dp"
android:paddingRight="16dp"
android:text="Best food quality in cheapest price.One of the best stores
of california. Home delivery available 24x7"
android:textColor="#android:color/black"
android:textSize="20dp" />
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
</RelativeLayout>
In this code i am using nestedscroll view to scroll layout
You can solve it by two methods.
1.Create a layout for landscape orientation and change the layout in landscape and portrait orientation
2.Change the image width from match_parent to a fixed size and put it in a scroll view.
When you turn your device to landscape mode following line
android:adjustViewBounds="true"
starts its job. Which in turn forces your ImageView to increase its bounds to preserve aspect ratio of the image/drawable and your image goes out of the available view.
Read more about ImageViews here
Try removing above line and see how your app performs in both orientations.
OR
Use ScrollView with current code.
I would prefer scrollView if nothing works.

Android Grey Out LinearLayout

I have a linear layout which contains a set of child views (mixture of text, images and other layouts).
I want to grey out the linear layout and all the child views so they look disabled (similar to how a button works).
Is this possible to achieve? I know i can set a colour filter when painting on the canvas, is there something similar for layouts?
Another way is to call setEnabled() on each child (for example if you want to do some extra check on child before disabling), check out this answer:
https://stackoverflow.com/a/7069377/4840812
You can use Frame-layout
Using TEST ONE you can achieve above text view like disabled. You can set root layout clickable false for actually disable views inside layout.
TEST TWO is for understanding purpose. Like you need to manage order of view to show effect.
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<!--THIS IS TEST ONE-->
<TextView
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_marginTop="150dp"
android:background="#000000"
android:gravity="center"
android:text="TEST DATA"
android:textColor="#android:color/white"
android:textSize="30sp" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="200dp"
android:background="#DAD6D6D6"
android:gravity="center"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Data"
android:textColor="#color/colorAccent"
android:textSize="30sp" />
</LinearLayout>
<!--THIS IS TEST TWO-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="200dp"
android:layout_marginTop="300dp"
android:background="#DAD6D6D6"
android:gravity="center"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Data"
android:textColor="#color/colorAccent"
android:textSize="30sp" />
</LinearLayout>
<TextView
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_marginTop="400dp"
android:background="#000000"
android:gravity="center"
android:text="TEST DATA"
android:textColor="#android:color/white"
android:textSize="30dp" />
</FrameLayout>
To achieve your layout you can use the RelativeLayout. In RelativeLayout you can use the 2 different views or LinearLayout. In first layout you can add views according to your need, and In second layout you can set the alpha colorcode for disable the layout.
Please try below code:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerInParent="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/demo_img_1" />
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/demo_img_1"
android:layout_marginLeft="20dp"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/trans"/>
</RelativeLayout>
Here is output for code:

TextView Bar over Google Map

I am trying to implement a screen with a map and on top on the map it should have a textbar displaying text but for some reason my textbar always goes below the google map view.
I tried to look up for relateable questions but no success with their answers. The picture is attached below to give some more gudience. Code is below.
<?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"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:paddingStart="20dp"
android:paddingEnd="20dp">
<com.google.android.gms.maps.MapView
android:id="#+id/map"
android:elevation="10dp"
android:layout_below="#+id/tv_treatment_id"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/tv_rateDoctor"
>
</com.google.android.gms.maps.MapView>
<include
android:id="#+id/toolbar"
layout="#layout/menu_top_header"
android:layout_width="match_parent"
android:layout_height="#dimen/custom_toolbar_height"
/>
<TextView
android:id="#+id/tv_treatment_id"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/toolbar"
android:layout_marginBottom="20dp"
android:layout_centerHorizontal="true"
android:text="Treatment ID: 222-X-F"
android:textSize="#dimen/font_label" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/tv_information"
android:gravity="center"
android:layout_centerHorizontal="true"
android:layout_alignTop="#+id/map"
android:orientation="horizontal"
android:background="#color/colorTextGrey"
>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/tv_sent_info"
android:padding="20dp"
android:text="Your Treatment has been sent to the following lab"/>
</LinearLayout>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:padding="20dp"
android:id="#+id/tv_rateDoctor">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/rate_doctor"
android:textSize="#dimen/font_input"
android:fontFamily="#font/lato_bold"
/>
<ImageView
android:layout_marginStart="5dp"
android:layout_width="wrap_content"
android:layout_height="match_parent"
app:srcCompat="#drawable/ic_arrow_right"
android:layout_marginLeft="30dp" />
</LinearLayout>
Image of desirable output
Try the next layout. If you want to display something in front then you must put it at last in the layout.
EDIT
Try this code instead. I´m using it in a personal project and show buttons in front of the map. But of course im using a SupportMapFragment, maybe you can try using it too.
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<fragment
android:id="#+id/map"
class="com.google.android.gms.maps.SupportMapFragment"
android:layout_width="match_parent"
android:layout_height="250dp"/>
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="top|end"
android:gravity="top">
<!-- Put any TextView, Imageview, Button, etc inside -->
<LinearLayout/>
</FrameLayout>
Hope it helps!
try using this in your textView
android:layout_alignParentTop="true"
layout_alignParentTop
If true, makes the top edge of this view match the top edge of the
parent. Accommodates top margin.
May be a boolean value, such as "true" or "false".
You can also try using
android:layout_alignTop
which Makes the top edge of this view match the top edge of the given anchor view ID. Accommodates top margin.

Android XML Layout Layering

Is there a generally accepted way of doing this? My home screen initially looked like the below image, using the below code, to prompt the user to start a game.
Original home screen
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.example.android.snake.SnakeView
android:id="#+id/snake"
android:layout_width="match_parent"
android:layout_height="match_parent"
tileSize="24" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TextView
android:id="#+id/text"
android:text="#string/snake_layout_text_text"
android:visibility="visible"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:gravity="center_horizontal"
android:textColor="#ff8888ff"
android:textSize="24sp"/>
</RelativeLayout>
</FrameLayout>
This worked with no errors, but I needed to add items for user input (EditText) and show last 5 scores (Button) and wanted this prompt below it rather than putting the player through multiple screens. From what I've read, I should be able to embed a FrameLayout inside a RelativeLayout with no conflicts, but it only works to the Show Scores button and the game prompt is missing. When I check it in design view, I am also now getting an error that the bottom half (which is now showing) is failing to instantiate the class that would allow the game to play. I am simply beside myself on how to correct this and would like to understand what I have done wrong so as to not allow this to happen again on future projects. Below is the modified code that causes the errors.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Username"
android:id="#+id/textViewName"/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/editTextName"/>
<Button
android:layout_width="fill_parent"
android:layout_height="wrap_content"
style="?android:attr/buttonStyleSmall"
android:text="Add"
android:id="#+id/btnAdd"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Last 5 Games"
android:id="#+id/btnLastFive"/>
<FrameLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.example.android.snake.SnakeView
android:id="#+id/snake"
android:layout_width="match_parent"
android:layout_height="match_parent"
tileSize="24" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TextView
android:id="#+id/text"
android:visibility="visible"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:gravity="center_horizontal"
android:textColor="#ff8888ff"
android:textSize="24sp"/>
</RelativeLayout>
</FrameLayout>
</LinearLayout>
Proposed layout
You should add the namespace of the custom view com.example.android.snake.SnakeView on your root layout, and add the namespace prefix before the declaration of your custom Views attributes.
So assuming the namespace is "app", tileSize becomes for example app:tileSize
<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">
......
<com.example.android.snake.SnakeView
android:id="#+id/snake"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:tileSize="24" />
.....
</LinearLayout>
It also seems that you have removed the text content "Snake Press up to play" from your TextView #+id/text, otherwise you won't be able to see it.

Android layout objects placement

I have this simple activity in my android app but I don't know how to place my button so it appears at the same position on various screen sizes.
I want the button to always be placed at the bottom of the screen. The screenshot shown is from a phone screen. When displayed on a larger screen the button is higher up.
How can I fix this?
Thanks
See this screenshot
You can use RelativeLayout with this parameter (android:layout_alignParentBottom="true")
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:text="Click Me!"/>
</RelativeLayout>
You should use a RelativeLayout
If you have a RelativeLayout that fills the whole screen you should be able to use android:layout_alignParentBottom to move the button to the bottom of the screen.
If your button at the bottom doesn't show then probably the layout above it takes all the space. In this case you can put the button first in your layout file and position the rest of the layout above the views with android:layout_above.
Have a look a RelativeLayout. Use this ViewGroup and add a Button inside it with alignParentBottom
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
<Button
android:id="#+id/button_id"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:alignParentBottom="true"
android:text="HORAIRE"
android:layout_margins="<your_margin_in_dp>" />
</RelativeLayout>
Make footerButton.xml:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/footer"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:gravity="center" >
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:text="HORAIRE"
android:textColor="#ffffff"
android:textSize="20sp" />
</RelativeLayout>
And add it in all your layout file like below line:
Android Activity_Layout
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<!-- Footer aligned to bottom -->
<include layout="#layout/footer" />
<!-- Content above footer -->
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_above="#id/footer"
android:layout_below="#id/header"
android:gravity="center">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Content goes here"
android:textColor="#FFFFFF"
android:textSize="20sp" />
</RelativeLayout>
</RelativeLayout>
Hope it will solve your problem
This is what I ended up doing. Thanks to everyone who posted, it helped me get in the right direction!
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="#+id/container"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:showIn="#layout/activity_main"
tools:context="xxxx.MainActivity"
android:orientation="vertical"
android:weightSum="1">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Dernières nouvelles Twitter"
android:id="#+id/textView"
android:textStyle="bold"
android:textSize="17dp"
android:paddingLeft="8dp"
android:paddingTop="6dp"
android:paddingRight="6dp"
android:paddingBottom="6dp"
android:layout_alignParentTop="true"/>
<ListView
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:id="#+id/listView_tweets"
android:layout_above="#+id/buttonDisplay"
android:choiceMode="none"
android:paddingTop="25dp"
android:paddingLeft="10dp"
android:paddingRight="10dp"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Horaire"
android:layout_margin="5dp"
android:id="#+id/buttonDisplay"
android:onClick="buttonGotoDisplay"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"/>
</RelativeLayout>

Categories

Resources