It looks like some issues appears on the display of my app when I run it on old devices. Here is what I observe.
1) When I open my app in recent phones (above NEXUS 5) the screen of the dialog I am showing appear properly all the elements are there. They are all defined with a height of "WRAP_CONTENT".
2) When I run my app in NEXUS 4, the dialog appears cut, even though there is still space on the screen...For whatever reason it looks like the "WRAP_CONTENT" does not work... but if I set the height of the dialog programmaticaly then it is working (I try setup the height of the button and the framelayout without success).
Any idea what I am missing there? If you advise me to set the height programmaticaly, then my problems become how to know if the user is using an old device or not so that when he is I define the pop-up taking the whole screen otherwise not...
I have included a screenshot of what I see on recent phone (just below, you can see the button cool completely) and what I see on NEXUS4 (second screenshot you can only see the beginning of the button cool...)
and below is the XML I am using
<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/popup_swiperewards_flMainwindow"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_margin="32dp"
android:id="#+id/popup_swiperewards_llMaincontainer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:orientation="vertical"
android:background="#DD000000">
<TextView
android:id="#+id/popup_swiperewards_tvUsername"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="USER NAME"
android:textColor="#android:color/white"
android:textStyle="bold" />
<ImageView
android:id="#+id/popup_swiperewards_ivSeparator1"
android:scaleType="fitXY"
android:gravity="center"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:src="#drawable/stripe_separator" />
<pro.appus.takemeout.ui.views.ViewPagerWrapContent
android:id="#+id/popup_swiperewards_vpAwardcontainer"
android:gravity="center"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<com.viewpagerindicator.CirclePageIndicator
android:id="#+id/popup_swiperewards_cpiCircleindicator"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
app:fillColor="#FFFFFF"
app:pageColor="#android:color/transparent"
app:radius="6dp"
app:strokeColor="#FFFFFF"
app:strokeWidth="1dp" />
<ImageView
android:id="#+id/popup_swiperewards_ivSeparator2"
android:scaleType="fitXY"
android:gravity="center"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:src="#drawable/stripe_separator" />
<TextView
android:id="#+id/popup_swiperewards_tvComeagain"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Come again tomorrow \n to collect %d TMO"
android:textAllCaps="true"
android:textColor="#android:color/white"
android:textStyle="bold" />
<FrameLayout
android:id="#+id/popup_swiperewards_btnCoolContainer"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<Button
android:id="#+id/popup_swiperewards_btnCool"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:includeFontPadding="true"
android:background="#drawable/appsettings_button_silver"
android:text="Cool"
android:textAllCaps="true"
android:textColor="#android:color/white" />
</FrameLayout>
</LinearLayout>
</FrameLayout>
I found the mistake, it was in the code there where the margin was too big for that screen...
<LinearLayout
**android:layout_margin="32dp"**
android:id="#+id/popup_swiperewards_llMaincontainer"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:orientation="vertical"
android:background="#DD000000">
Related
I have following problem, I want to add a ImageView (the Google Play button) to my dialog which stays in place, no matter which device the app is running on.
Here is what it should look like:
This is what it looks like on some devices:
Here is the XML:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/goProDialogImage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:scaleType="fitXY"
android:adjustViewBounds="true"
android:src="#drawable/goldversiondialog"/>
<ImageView
android:id="#+id/googleplaybutton"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignRight="#+id/goProDialogImage"
android:layout_alignBottom="#+id/goProDialogImage"
android:adjustViewBounds="true"
android:scaleType="fitXY"
android:maxHeight="250dp"
android:maxWidth="250dp"
android:layout_marginRight="20dp"
android:layout_marginBottom="20dp"
android:src="#drawable/gpbutton" />
</RelativeLayout>
How can I tell the app to never put the Image above the golden veil?
Do this:
<LinearLayout
android:weightSum="1"
android:gravity="end"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/googleplaybutton"
android:layout_width="0dp"
android:layout_weight="0.5"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:src="#drawable/ic_logo" />
</LinearLayout>
I have removed some of your properties, the key point is that you need to use weightSum in LinearLayout and apply weight to your ImageView(I have given 0.5, you can change according to your need). Also, do not set android:scaleType to fitXY, keep the aspect ratio so the height will change according to the width.
I have a problem whose solution I am unable to find out. I am creating an imagebutton thorugh Android SDk and although it shows in Preview window it does not show in Nexus 6 Emulator. The image is attached here
Code for xml file is
<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:padding="10dp"
tools:context=".ViewActivity">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello World!"
android:textSize="#dimen/activity_bold_textsize"
/>
<ImageButton
android:id="#+id/imageButton"
android:layout_width="match_parent"
android:layout_height="wrap_content"
tools:src="#tools:sample/avatars" />
<CheckBox
android:id="#+id/checkBox"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/rememberMe" />
<RadioGroup
android:id="#+id/radio_g1"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<RadioButton
android:id="#+id/rad1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/rad1"/>
<RadioButton
android:id="#+id/rad2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/rad2"
/>
</RadioGroup>
<ToggleButton
android:id="#+id/toggleButton"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/togb1" />
<Switch
android:id="#+id/switch1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/Switch" />
</LinearLayout>
You do not known the diffenrence between tools and android.
tools:src="#tools:sample/avatars" is only show on preview of IDE.
Change to
android:src="#tools:sample/avatars"
Check the document: https://developer.android.com/studio/write/tool-attributes
Cause of, You are used tools:src attribute instead of android:src.
tool:<attributes> = Working only in preview emulator. It just show you Temporary hint.
android:<attributes> = Used for the actual definition that you have defined
for Ex. If you use tool:text within textView. It's only shown like hint as how looks applied theme.
I have a task - make an activity like this Here photo takes one half of screen and text takes another. And everything works fine with weights, but sometimes text can take a lot of space and don't fit in screen, so I covered all my layout with ScrollView, but here comes problem. If everything doesn't fit into one screen everything should look that way - photo will take one half of visible screen and second half will contain some part of text that can fit there, and when I scroll, everything should be scrolled and new text will appear at the bottom. But I don't understand how to realize that, weights here work in some weird way and as I understood tag fillViewPort="true" makes something only if there is nothing to scroll, and when there is something this tag makes nothing. So how can I make my view look in proper way?
Here is my XML
<?xml version="1.0" encoding="utf-8"?>
<ScrollView 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:fillViewport="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
tools:context="leopikinc.musiciansyandex.MusicianInfo"
android:orientation="vertical">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/big_photo"
android:src="#drawable/test"
android:layout_gravity="center" />
</LinearLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Genres"
android:id="#+id/genres"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Album count"
android:id="#+id/album_count"
android:layout_below="#+id/genres"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Track count"
android:id="#+id/track_count"
android:layout_above="#+id/biography_string"
android:layout_toRightOf="#+id/album_count"
android:layout_toEndOf="#+id/album_count" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="#string/biography_string_text"
android:id="#+id/biography_string"
android:layout_below="#+id/album_count"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Biography Text"
android:id="#+id/biography_text"
android:layout_below="#+id/biography_string"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
</RelativeLayout>
</LinearLayout>
</ScrollView>
I achived my aim making it programmaticaly. In activity I got access to ImageView and set it's height = half of visible screen.
ViewGroup.LayoutParams lp = bigphoto.getLayoutParams();
lp.height = getResources().getDisplayMetrics().heightPixels/2;
bigphoto.setLayoutParams(lp);
But still I don't know how to make this using XML
I am tying to create a UI like the image below.
This is how it SHOULD look like: (Screen shot from my app using Nexsus 5):
And this is how it look like on a Nexsus S device (4 inch):
Someone have an idea why the diffrences happen? This is my XML code:
<?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:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#2e2e2e"
tools:context=".MainActivity"
android:id="#+id/viewew">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:weightSum="9"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:layout_marginBottom="0dp"
android:layout_weight="8"
android:gravity="center_vertical"
>
<View
android:layout_width="0px"
android:layout_height="match_parent"
android:layout_weight="15" />
<Button
android:id="#+id/www"
android:layout_weight="2"
android:layout_width="90dp"
android:layout_height="90dp"
android:background="#drawable/www"
android:paddingLeft="10dp"
android:paddingRight="10dp"
/>
<View
android:layout_width="0px"
android:layout_height="match_parent"
android:layout_weight="15" />
<Button
android:id="#+id/www"
android:layout_weight="2"
android:layout_width="90dp"
android:layout_height="90dp"
android:background="#drawable/www"
android:paddingLeft="10dp"
android:paddingRight="10dp"
/>
<View
android:layout_width="0px"
android:layout_height="match_parent"
android:layout_weight="15" />
<Button
android:id="#+id/www"
android:layout_weight="2"
android:layout_width="90dp"
android:layout_height="90dp"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:background="#drawable/www"
/>
<View
android:layout_width="0px"
android:layout_height="match_parent"
android:layout_weight="15" />
</LinearLayout>
<View
android:id="#+id/idd"
android:layout_width="match_parent"
android:layout_height="400dp"
android:layout_alignParentBottom="true"
android:layout_weight="2"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="2"
android:layout_centerHorizontal="true"
android:text="Doesn't belong here?"
android:layout_alignParentBottom="true"
/>
</LinearLayout>
<include layout="#layout/buttons" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="2"
android:layout_centerHorizontal="true"
android:text=" here?"
android:paddingBottom="15dp"
android:layout_alignParentBottom="true"
android:textColor="#f7f7f7"
android:id="#+id/tDoesntBelongHere"
/>
<com.lorentzos.flingswipe.SwipeFlingAdapterView
android:id="#+id/frame"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:rotation_degrees="15.5"
android:layout_above="#+id/eee"
tools:context=".MyActivity" />
</RelativeLayout>
On android studio you have to set the screen size for different devices.
your buttons have this:
android:layout_width="90dp"
android:layout_height="90dp"
So whichever screen you are using the size will always be 90dp.
In android studio you can create more xml pages for same page: one for portrait, for landscape, ecc ecc and also one for small-big-xxl ecc screen.
Have a look at this link from android developer site.
Hope it help :)
EDIT:
At the moment i don't have Android studio in the pc i'm working on, so i try to explain a possible solution.
Instead of setting height and width, set margins:
You can anchor all from botside, adding in your TextView android:layout_alignParentBottom="true" (and a margin-bottom if you want). Then keep your view with a static height of 400dp like now, then anchor it to the top of the TextView by android:layout_above="#id/TextViewId (it doesn't have id, add it)
Now you have to do the same with your LinearLayout: use android:layout_above="#id/idd and removing the the static size. At this point you can just let your buttons to set height equals to the LinearLayout's height (obiouvsly you can set margin top-bot in buttons).
Sorry if my english is not that good, i hope u got the solution
I know a ton of questions on this topic have been asked but none seem to work for me. I have a linear layout with an an edit text and icons below but when the keyboard pops up it covers the icons and half the edit text.
My Manifest File:
<activity
android:name="com.social.pages.Post"
android:windowSoftInputMode="stateVisible|adjustResize"
android:screenOrientation="portrait" >
</activity>
My Layout File:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/feed_bg" >
<LinearLayout
android:id="#+id/stories_post_entire"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/story_post"
android:layout_centerHorizontal="true"
android:background="#drawable/bg_parent_rounded_corner"
android:orientation="vertical"
android:paddingBottom="#dimen/feed_item_padding_top_bottom"
android:paddingTop="#dimen/feed_item_padding_top_bottom" >
<!--
<LinearLayout
android:id="#+id/stories_post_text"
android:layout_width="fill_parent"
android:layout_height="300dp"
android:layout_marginTop="15dp"
android:orientation="horizontal"
android:paddingBottom="#dimen/feed_item_padding_top_bottom"
android:paddingLeft="#dimen/feed_item_padding_left_right"
android:paddingRight="#dimen/feed_item_padding_left_right" >
-->
<EditText
android:id="#+id/stories_post_story"
android:layout_width="fill_parent"
android:layout_height="300dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_marginTop="10dp"
android:background="#drawable/bg_parent_rounded_corner"
android:ems="10"
android:gravity="top"
android:hint="Tell Your Story..."
android:padding="10dp"
android:paddingLeft="10dp"
android:scrollbars="vertical"
android:typeface="serif" />
<LinearLayout
android:id="#+id/stories_post_bar"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_marginTop="10dp"
android:paddingLeft="#dimen/feed_item_padding_left_right"
android:paddingRight="#dimen/feed_item_padding_left_right" >
<ImageView
android:id="#+id/stories_post_tag"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="fitCenter"
android:src="#drawable/tag" />
<ImageView
android:id="#+id/stories_post_take_pic"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="30dp"
android:scaleType="fitCenter"
android:src="#drawable/take_pic" />
</LinearLayout>
</LinearLayout>
<!-- </LinearLayout> -->
<Button
android:id="#+id/story_post"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:text="Post" />
</RelativeLayout>
No Java code has been written yet.
You're setting the EditText element to 300dp height which prevents anything from moving up. I was able to fix this by wrapping the EditText and following LinearLayout (that houses your images) in a RelativeLayout. By doing this, you can set the image-housing LinearLayout to alignParentBottom="true". I believe this is your desired effect.
<?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" >
<LinearLayout
android:id="#+id/stories_post_entire"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/story_post"
android:layout_centerHorizontal="true"
android:orientation="vertical" >
<!-- ADDITION -->
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<EditText
android:id="#+id/stories_post_story"
android:layout_width="fill_parent"
android:layout_height="300dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="5dp"
android:layout_marginTop="10dp"
android:ems="10"
android:gravity="top"
android:hint="Tell Your Story..."
android:padding="10dp"
android:paddingLeft="10dp"
android:scrollbars="vertical"
android:typeface="serif" />
<LinearLayout
android:id="#+id/stories_post_bar"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_alignParentBottom="true"
android:layout_marginTop="10dp" >
<!-- ADDITION ^^^ alignParentBottom-->
<ImageView
android:id="#+id/stories_post_tag"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="fitCenter"
android:src="#drawable/osumu_blur"/>
<ImageView
android:id="#+id/stories_post_take_pic"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="30dp"
android:scaleType="fitCenter"
android:src="#drawable/osumu_blur"/>
</LinearLayout>
<!-- ADDITION -->
</RelativeLayout>
</LinearLayout>
<!-- </LinearLayout> -->
<Button
android:id="#+id/story_post"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:text="Post" />
</RelativeLayout>
NOTE: I replaced your drawable src with "dummy_image"
THe only thing you can do about the soft keyboard is to set the android:windowSoftInputMode in the manifest (or to change it on the fly programatically). The allowed modes are basically nothing (just let the keyboard pop up and cover whatever), pan (scrolls the app such that the cursor is on the screen), and resize (resizes your app to lay out completely above the keyboard).
You obviously want resize. However to make that work, your layout needs to be resizable- there needs to be some element that can be shrunk and still fit your app in the smaller size, or there needs to be empty space that can be shrunk. If you have to much on screen, that won't work. And in that case Android will still ensure that the cursor is on screen, but will not do anything else.
Looking at your layout- I don't see anything that can shrink. You may be able to refactor it to make the edit text use fill_parent so it can be shrunk, but that would require making it (or its direct parent) layout_above and layout_below two other elements so it is sized to be the remaining space between them. That's about all I can see for you to do, other than remove elements.