I'm creating a tabbed activity. As long as the first tab is selected, the soft keyboard should be visible. I achieved that by adding this line to my manifest file in the activity tag:
android:windowSoftInputMode="stateVisible|adjustResize"
As the keyboard opens, the space for the layout shrinks. The most space is occupated by an ImageView. I want it to shrink with the layout size to allow the other 2 views (which should remain the same size) to fit on the screen. However, although the soft input mode is set to adjustResize, the ImageView keeps its size after the keyboard opens. Here's a comparison of the current layout and the one I want to achieve (the ImageView is the red rectangle):
comparison
My fragment's layout code:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout android:layout_width="match_parent"
android:layout_height="wrap_content"
xmlns:tools="http://schemas.android.com/tools"
tools:context=".DataInputFragment"
android:orientation="vertical"
xmlns:android="http://schemas.android.com/apk/res/android">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:scaleType="fitStart"
android:src="#drawable/image"/>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:orientation="vertical">
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/input_label_text"/>
<namespace.InputEditText
android:id="#+id/input_edit_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
<requestFocus/>
</namespace.InputEditText>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/submit"
</LinearLayout>
</RelativeLayout>
My activity:
<?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:id="#+id/main_content"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fitsSystemWindows="true"
android:orientation="vertical"
tools:context=".MainActivity">
<android.support.design.widget.TabLayout
android:id="#+id/tabs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
style="#style/TabLayout">
<android.support.design.widget.TabItem
android:id="#+id/tabItem"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/tab_text_1" />
<android.support.design.widget.TabItem
android:id="#+id/tabItem2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/tab_text_2" />
</android.support.design.widget.TabLayout>
<android.support.v4.view.ViewPager
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior" />
</LinearLayout>
How to force the ImageView to resize according to the screen size to make all of the views fit on the screen?
[EDIT]: My attempt to create a ConstraintLayout, which didn't solve the problem (the ImageView still keeps its original size):
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 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="wrap_content"
android:orientation="vertical"
tools:context=".DataInputFragment">
<ImageView
android:id="#+id/img"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:scaleType="fitStart"
android:src="#drawable/image"
android:adjustViewBounds="true"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="#+id/input_label"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/input_label_text"
app:layout_constraintTop_toBottomOf="#id/img"/>
<namespace.InputEditText
android:id="#+id/input_edit_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintTop_toBottomOf="#id/input_label">
<requestFocus />
</namespace.InputEditText>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/submit"
app:layout_constraintTop_toBottomOf="#id/input_edit_text"/>
</android.support.constraint.ConstraintLayout>
I've created an Android Project from scratch on Android Studio 4.0, using the "Tabbed Activity" template and uploaded it to GitHub.
I've had no issues with the resize taking place when the activity is resized.
What Did I change?
In the manifest.xml I added android:windowSoftInputMode="adjustResize"
I modified the default layout for the fragment in the tab to include an ImageView (called imageToShrink) and an EditText (called editLayout).
I left the existing TextView untouched, except that since it's at the top, I made it the HEAD of the vertical Chain, and gave it a 0.0 BIAS to be aligned at the top, rather at the center.
When you tap on the cyan EditText at the bottom, the keyboard pops (I made it number only so it's even taller) and you can see how the image is re-drawn after its new size is recomputed.
This is how it looks when it opens: (beautiful color palette!)
And this is how it looks when I tap the "edit field" to pop the keyboard:
your ImageView should not have wrap_content attributes, because it will always have constant size and wont be able to resize automatically. I would suggest using ConstraintLayout and use app:layout_constraintDimensionRatio. Other option is use LinearLayout weight (not recommending).
Ant third option is to detect when keyboard is visible, when not with ViewTreeObserver.OnGlobalLayoutListener and do stuff programmaticaly.
Try this:
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 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=".DataInputFragment">
<ImageView
android:id="#+id/img"
android:layout_width="match_parent"
android:layout_height="0dp"
android:adjustViewBounds="true"
android:scaleType="fitStart"
android:src="#drawable/image"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintDimensionRatio="3:1"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="0.0" />
<TextView
android:id="#+id/input_label"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/input_label_text"
app:layout_constraintTop_toBottomOf="#id/img" />
<EditText
android:id="#+id/input_edit_text"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:layout_constraintTop_toBottomOf="#id/input_label">
<requestFocus />
</EditText>
<Button
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/submit"
app:layout_constraintTop_toBottomOf="#id/input_edit_text" />
</android.support.constraint.ConstraintLayout>
Related
I want my whole screen to scroll but only my recycler will scroll at the moment. This occurs despite all elements being placed in a linear layout inside a Scroll View.
Any ideas where the error is? Here's the relevant code.
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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=".NoodleDetailActivity">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<ImageView
android:id="#+id/noodleImage"
android:layout_width="match_parent"
android:layout_height="200dp"
android:adjustViewBounds="false"
android:scaleType="centerCrop"
app:srcCompat="#mipmap/ic_launcher" />
<TextView
android:id="#+id/description"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#drawable/border_bottom"
android:fontFamily="sans-serif-smallcaps"
android:hapticFeedbackEnabled="false"
android:padding="30dp"
android:text="TextView"
android:textSize="18sp" />
<androidx.recyclerview.widget.RecyclerView
android:id="#+id/extras_recycler"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_margin="0dp"
android:background="#F2F2F2"
android:padding="0dp" />
</LinearLayout>
</ScrollView>
</androidx.constraintlayout.widget.ConstraintLayout>
This is what it looks visually.
demo appearance
Found out: it seems best practice is to set the recyclerView to be the whole layout and make it contain multiple view types.
I won't be using a nested scroll view.
I have got a relative Layout in which I want to display one Imageview and one TextView with background-image.
If I didn't use any margin-top it works how I should, but if I increase the top margin of the ImageView the Image gets smaller.
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 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="wrap_content">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/playerNameEnd"
android:layout_width="200dp"
android:layout_height="80dp"
android:background="#drawable/casino2"
android:gravity="center"
android:text="Player"
android:textColor="#color/cream"
android:textSize="26sp" />
<ImageView
android:id="#+id/roulette_EndPic"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="40dp"
app:srcCompat="#drawable/casino" />
</RelativeLayout>
</android.support.constraint.ConstraintLayout>
Use android:paddingTop="40dp"
instead of marginTop
I am trying to make my layout edge round so I am using card view and
also trying to define my own XML with rounded settings and thus link the XML to the background of the Linear Layout but that is also not working.
I have also attached the picture What I am getting from there but I want White rectangular edges to be gone-
..enter image description here
app:cardCornerRadius="9dp"
but here I am getting rectangular background and I don't understand where that white background come from. So, here's my code-
<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
xmlns:app="http://schemas.android.com/apk/res-auto"
app:cardCornerRadius="9dp"
xmlns:android="http://schemas.android.com/apk/res/android">
<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:orientation="vertical" android:layout_width="match_parent"
android:id="#+id/relative_layout"
android:layout_height="wrap_content">
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="46dp"
android:id="#+id/toolbar"
android:background="#color/fab_background">
</android.support.v7.widget.Toolbar>
<RelativeLayout
android:padding="16dp"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:layout_marginBottom="10dp"
android:layout_width="50dp"
android:layout_height="40dp"
android:src="#drawable/expense"
android:id="#+id/expense_image"/>
<EditText
android:layout_marginLeft="29dp"
android:layout_width="match_parent"
android:layout_toRightOf="#id/expense_image"
android:layout_height="40dp"
android:hint="#string/expense"
android:id="#+id/expense"
android:inputType="number"/>
<ImageView
android:layout_width="50dp"
android:layout_height="40dp"
android:src="#drawable/note"
android:id="#+id/note_image"
android:layout_marginTop="60dp"/>
<EditText
android:layout_marginLeft="29dp"
android:layout_marginTop="20dp"
android:layout_toRightOf="#id/note_image"
android:layout_below="#id/expense"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:hint="#string/add_note"
android:id="#+id/add_note"/>
</RelativeLayout>
<Button
android:layout_marginTop="20dp"
android:layout_width="150dp"
android:layout_height="40dp"
android:layout_margin="16dp"
android:id="#+id/putOn"
android:layout_below="#id/add_note"
android:text="#string/put_on"
android:background="#android:color/darker_gray"/>
</LinearLayout>
</android.support.v7.widget.CardView>
If you are using CardView as a root for for your alert dialog then do as follows . Let me know if it works .
<android.support.v7.widget.CardView
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:id="#+id/card_view"
android:layout_gravity="center"
card_view:cardBackgroundColor="#android:color/transparent"
card_view:cardCornerRadius="4dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/white"
android:orientation="vertical">
// Your layout goes here
</LinearLayout>
</android.support.v7.widget.CardView>
If still not work then use card_view:cardPreventCornerOverlap attribute in cardview .
Whereas you can use android.support.v7.app.AppCompatDialog for same appearance without any CardView.
Here is the xml in which ScrollView layout size will vary means it will zoom image on button click but my top headers and footer will always be in same position irrespective of zoom values.......
XML
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/layout_zoom_buttons"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="#+id/btn_zoomIn"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="#drawable/zoomin1" />
<ImageView
android:id="#+id/btn_zoomout"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:src="#drawable/zoomin1" />
</LinearLayout>
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<com.example.imagetouchview.TouchImageView
android:id="#+id/imagezoom"
android:layout_width="fill_parent"
android:layout_height="400dp"
android:layout_gravity="center">
</com.example.imagetouchview.TouchImageView>
</ScrollView>
<LinearLayout
android:id="#+id/layout_buttons"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<ImageView
android:id="#+id/btn_email_fatwa"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:src="#drawable/zoomin1"
android:layout_weight="1"/>
<ImageView
android:id="#+id/btn_share_fatwa"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:src="#drawable/zoomin1"
android:layout_weight="1"/>
<ImageView
android:id="#+id/btn_save_fatwa"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:src="#drawable/zoomin1"
android:layout_weight="1"/>
</LinearLayout>
</LinearLayout>
this layout is fine in vertical orientation while when device orientatio changes to Horizontal the bottom buttons are invisible.I am following Salmans Ayub Answer For Image Zoomin and Out
I think You have design your layout in portrait mode(verticaly). Now either you have to bound it for
portrait mode by adding this line android:screenOrientation="portrait" in your activity manifest,
OR
You have to design it for landscape mode by following this link-
Android: alternate layout xml for landscape mode
I'm trying to create a new LinearLayout and now i have added a text and a background and now the background appears and still not full as it seems in the graphical they both show up in the graphical layout
example here:
https://www.dropbox.com/s/k58uznho9pu5qky/Untitled1.png
and when i test it out in a emulator which is real device the background isn't showing probably with some white space down and the text doesn't even appear
example here:
https://www.dropbox.com/s/q9e45sunbsesrd1/uniteled3.png
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:ads="http://schemas.android.com/apk/lib/com.google.ads"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/relLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="right"
android:orientation="vertical"
tools:context=".SecondActivity" >
<LinearLayout
android:id="#+id/linearlayout2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/images"
android:gravity="center|right"
android:orientation="vertical" >
<TextView
android:id="#+id/two"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:paddingTop="10sp"
android:text="testing ytestifnfndfijdfhffdkjdfkjfdjkj"
android:textSize="25sp" />
</LinearLayout>
</ScrollView>
How does this fit your needs? If you plan to add more content, then the root component can be ScrollView with the background. But with only one TextView, there should be no need for ScrollView unless the text is huge.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:ads="http://schemas.android.com/apk/lib/com.google.ads"
xmlns:tools="http://schemas.android.com/tools"
android:background="#drawable/images"
android:gravity="center"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context=".SecondActivity" >
<TextView
android:id="#+id/two"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center"
android:text="testing ytestifnfndfijdfhffdkjdfkjfdjkj"
android:textSize="25sp" />
</LinearLayout >
to fill whole screen with your layout use match_parent for layout_height and layout_width
<LinearLayout
android:id="#+id/linearlayout2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/images"
android:gravity="center|right"
android:orientation="vertical" >