i'm building an tutorial app where im displaying code snippet to user, but scrolling is just working on white area of the screen but not over the code snippet, may be codeview is overlapping the scrollview, How to resolve it so the codeview also scroll:
<?xml version="1.0" encoding="utf-8"?>
<ScrollView android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
<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="activity_main.xml"
android:textColor="#android:color/black"
android:textStyle="bold"
android:layout_marginTop="5dp"
android:textSize="18sp"/>
<io.github.kbiakov.codeview.CodeView
android:id="#+id/code_view_xml"
android:layout_marginTop="7dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="create layout resource file inside layout directory with name:"
android:layout_marginTop="10dp"
android:textColor="#000000"
android:textStyle="italic"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="single_item.xml"
android:textColor="#android:color/black"
android:textStyle="bold"
android:layout_marginTop="5dp"
android:textSize="18sp"/>
<io.github.kbiakov.codeview.CodeView
android:id="#+id/code_view_item"
android:layout_marginTop="7dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
</ScrollView>
here the output :
You are missing padding. Try adding padding.
Also your linearlayout height is match_parent. Change that to wrap and then try
Related
I am new to android programming and I am trying to slide my view over image.This is my code(Not sure if this is the right way)
<?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">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ron"
android:scaleType="fitCenter"/>
<android.support.v7.widget.CardView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:id="#+id/cv">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="16dp"
>
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/person_photo"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginRight="16dp"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/person_name"
android:layout_toRightOf="#+id/person_photo"
android:layout_alignParentTop="true"
android:textSize="30sp"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/person_age"
android:layout_toRightOf="#+id/person_photo"
android:layout_below="#+id/person_name"
/>
</RelativeLayout>
</android.support.v7.widget.CardView>
I want to scroll my cardview over image keeping image fixed.something like eclipsing the image.
and after scrolling completely the image should get hidden.(I dont want it to flow under toolbar)
Try to place your CardView into ScrollView and add CardView's marginTop which equals to your Image's height.
I'm using TabWidget to get tabbed navigation. Each tab tile has icon and text below it. As content of my tab I currently have cardview list.
So, tab button layout:
<LinearLayout android:id="#+id/tabsLayout"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:gravity="center"
android:orientation="vertical">
<ImageView
android:id="#+id/tab_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content" android:layout_gravity="bottom|center"/>
<TextView android:id="#+id/title"
style="#android:style/TextAppearance.Holo.Medium"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:textColor="#000000"
android:text="test"
android:visibility="visible"
android:focusableInTouchMode="false"
android:layout_gravity="center"
android:textIsSelectable="true" android:textSize="13sp"
android:textAlignment="center"
android:gravity="center_horizontal"/>
</LinearLayout>
My activity where tab widget is used:
<?xml version="1.0" encoding="utf-8"?>
<TabHost
android:id="#android:id/tabhost"
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<FrameLayout
android:id="#android:id/tabcontent"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_weight="0"/>
<FrameLayout
android:id="#+id/realtabcontent"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="1"/>
<TabWidget
android:id="#android:id/tabs"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="0"
android:orientation="horizontal" android:background="#84dadada"/>
</LinearLayout>
</TabHost>
FrameLayout is for replacing tab content with fragments when user switch between tabs. It works, but there are some problems though. This is how it looks like:
As you can see - first problem is icon alignment. If text is wrapped as multiline (large font and small screen), icon is not aligned with the rest ones that have one line label. How to get all icons properly aligned?
Second - there is white extra space just above my tab control - why? How to disable it?
Any ideas?
[edit]
My CardView is defined as follows:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
android:padding="3dp"
>
<android.support.v7.widget.CardView android:id="#+id/card_view"
xmlns:card_view="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_gravity="center_vertical"
android:background="?android:attr/selectableItemBackground"
card_view:cardCornerRadius="0dp"
card_view:cardElevation="dp" android:clickable="false">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center_vertical"
android:orientation="horizontal">
<ImageView
android:id="#+id/card_image"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="2"
android:padding="6dp"
android:src="#drawable/ic_launcher"/>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="5"
android:orientation="vertical"
android:padding="4dp">
<TextView
android:id="#+id/card_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="2dp"
android:text="Large Text"
android:textAppearance="?android:attr/textAppearanceLarge"
android:textStyle="bold"/>
<TextView
android:id="#+id/card_info"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="2dp"
android:text="Small Text"
android:textAppearance="?android:attr/textAppearanceSmall"/>
</LinearLayout>
<ImageView
android:id="#+id/arrow"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_weight="1"
android:padding="6dp"
android:src="#drawable/arrow"/>
</LinearLayout>
</android.support.v7.widget.CardView>
</LinearLayout>
So it seems there is extra margin around cardview - top, bottom, left and right. How to disable it?
For the space issue have a look here, it may be a duplicate answer.
For the icon-alignment, have a look here, it shows how to keep your text on a single-line and use ellipsis to truncate it if your device doesn't have room to show it entirely. It may not be your perfect solution, but it's a good hint.
When the keypad appears when the user clicks on an EditText, parts of the layout is covered by the keypad. So I tried using ScrollView so the user can scroll down and see the rest of the layout. But its not scrolling. I can't seem to get my scroll view working. The I have searched on stackoverflow for the solution for 3 hours and couldn't find it.
<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true">
<RelativeLayout
android:id="#+id/new_meal_form_relative"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="#+id/meal_label"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_marginLeft="2dp"
android:text="#string/meal_label"
android:textSize="20sp"
android:textIsSelectable="false"
android:textStyle="bold"/>
<EditText
android:id="#+id/meal_name"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/meal_label"
android:hint="Event Title"
android:inputType="textCapSentences"
android:maxLines="1"/>
<EditText
android:id="#+id/meal_location"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/meal_name"
android:hint="Location(eg: CSC Room232)* "
android:inputType="textCapSentences"
android:maxLines="1"/>
<EditText
android:id="#+id/meal_event"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/meal_location"
android:gravity="top"
android:hint="Description of the event. What kind of food. Any additional info... \n"
android:inputType="textMultiLine|textCapSentences"/>
<TextView
android:id="#+id/textViewRating"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/meal_event"
android:text="Rating: "/>
<Spinner
android:id="#+id/rating_spinner"
android:layout_width="71dp"
android:layout_height="47dp"
android:layout_alignTop="#+id/textViewRequired"
android:layout_toRightOf="#+id/textViewRating"/>
<TextView
android:id="#+id/textViewRequired"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/textViewRating"
android:layout_alignParentRight="true"
android:layout_gravity="right"
android:text="*Required"
android:textColor="#ffff4b48"
android:textSize="15sp"/>
<com.parse.ParseImageView
android:id="#+id/meal_preview_image"
android:layout_width="wrap_content"
android:layout_height="100dp"
android:layout_below="#+id/rating_spinner"
android:layout_centerHorizontal="true"/>
<ImageButton
android:id="#+id/photo_button"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:src="#drawable/ic_action_photo"
android:layout_below="#+id/meal_preview_image"/>
<Button
android:id="#+id/save_button"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_below="#+id/photo_button"
android:layout_toLeftOf="#+id/cancel_button"
android:background="#ffff001f"
android:text="#string/post_button_text"/>
<Button
android:id="#+id/cancel_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#+id/photo_button"
android:text="#string/cancel_button_text"/>
<Space
android:layout_width="20px"
android:layout_height="20px"
android:layout_alignParentBottom="true"
android:layout_toRightOf="#+id/rating_spinner"
android:id="#+id/space"/>
<EditText
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/editText"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"/>
</RelativeLayout>
</ScrollView>
I have also tried adding "adjustResize" to the manifest file but it didn't do anything.
android:windowSoftInputMode="adjustResize"
Your ScrollView layout height should be wrap_content. Right now it's match_parent which means be as tall as my parent, not; be as tall as the content within me.
I'm attempting to split the UI for my horizontal layout into two halves each with it's own realative layout so I am able to center text and graphics within the two left and right halves of the screen. The problem is when I attmept to do so - the go button still ends up in the middle of the screen instead of centered on the right hand of the screen.
(If I can figure out how to center correctly I'm sure I'll be able to apply the same technique to the other elements to achieve the result I desire.
SOURCE:
<?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"
android:layout_marginBottom="8sp"
android:layout_marginLeft="8sp"
android:layout_marginRight="8sp"
android:layout_marginTop="8sp"
android:background="#drawable/background"
android:orientation="vertical" >
<RelativeLayout
android:id="#+id/start"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<ImageView
android:id="#+id/emblem"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:layout_marginTop="24dp"
android:gravity="center"
android:scaleType="fitStart"
android:src="#drawable/apn_app_logo" />
</RelativeLayout>
<RelativeLayout
android:id="#+id/start2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_centerVertical="true" >
<TextView
android:id="#+id/text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#+id/go_button"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:gravity="center"
android:text="#string/start_text2"
android:textColor="#000000"
android:textSize="18sp" />
<Button
android:id="#+id/go_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:background="#drawable/apn_app_go_button" />
</RelativeLayout>
</RelativeLayout>
EDIT: (in response to Kuba's answer)
<?xml version="1.0" encoding="utf-8"?>
<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:orientation="horizontal"
tools:context=".MainActivity" >
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#drawable/background"
android:gravity="center"
android:orientation="horizontal" >
<ImageView
android:id="#+id/emblem"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_marginTop="24dp"
android:gravity="center"
android:scaleType="fitStart"
android:src="#drawable/apn_app_logo" />
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#drawable/background"
android:gravity="center_horizontal"
android:orientation="horizontal" >
<Button
android:id="#+id/go_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/apn_app_go_button"
android:gravity="center_horizontal" />
<TextView
android:id="#+id/text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:text="#string/start_text2"
android:textColor="#000000"
android:textSize="18sp" />
</LinearLayout>
</LinearLayout>
Instead of Relative layout, I would recommend using LinearLayout.
<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:orientation="horizontal"
tools:context=".MainActivity" >
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="horizontal"
android:background="#00dd00"
android:gravity="center"
>
<Button
android:text="Button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</LinearLayout>
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="horizontal"
android:background="#dd0000"
android:gravity="center_horizontal"
>
<Button
android:text="Button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
</LinearLayout>
</LinearLayout>
In the inner LinearLayout you can either use android:gravity="center" to have its children centered vertically and horizontally. Or use use android:gravity="center_horizontal" to center in only horizontal way.
EDIT: Added the textview, which was discussed in the comments.
To have the textView appear underneath the button, you must change the orientation of the LinearLayout from horizontal to vertical. Please see the developer site .
The inner LinearLayout thus looks like this.
<LinearLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:orientation="vertical"
android:background="#dd0000"
android:gravity="center"
>
<Button
android:text="Button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="text here"
/>
</LinearLayout>
How can I use android:layout_below="#+id/go_button" in a linear layout?
You can't. These relationships only work in relative layout where you place views in relation to each other or the parent view. In linear layout items are stacked either vertically or horizontally.
Set android:gravity="center" in
<Button
android:id="#+id/go_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:background="#drawable/apn_app_go_button" />
Maybe its work.
I have this activity layout where I have a header (RelativeLayout), content (FrameLayout) and a footer (RelativeLayout) all inside a LinearLayout (please refer to the attached screenshot below) :
The problem is that sometimes when content (which is actually a Fragment) is large enough, it gets clipped by the footer (e.g. in the attached image one can see that some button are being clipped). I have tried setting the background of footer layout to transparent (via xml and via code as well), calling the FrameLayout.bringToFront() method but nothing seems to work!
Pasted below is the layout xml I am using:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/layoutMain"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#000000"
android:orientation="vertical"
tools:context=".BatwaSelectLanguage" >
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/layoutHeader"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_gravity="top" >
<ImageView
android:id="#+id/imBatwa"
android:layout_width="209dp"
android:layout_height="48dp"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
android:layout_marginLeft="30dp"
android:layout_marginTop="20dp"
android:src="#drawable/batwa" />
<Spinner
android:id="#+id/spLang"
android:layout_width="140dp"
android:layout_height="60dp"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:layout_marginRight="30dp"
android:layout_marginTop="20dp"
android:background="#000000"
android:prompt="#string/english" />
<TextView
android:id="#+id/tvSelectLanguage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerVertical="true"
android:layout_marginRight="20dp"
android:layout_marginTop="20dp"
android:layout_toLeftOf="#+id/spLang"
android:drawablePadding="30dp"
android:drawableRight="#drawable/line"
android:gravity="center"
android:text="#string/select_your_language"
android:textColor="#color/tvWhite"
android:textSize="#dimen/tvSizeSelectLang" />
</RelativeLayout>
<FrameLayout
android:id="#+id/content_frame"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" >
</FrameLayout>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/layoutFooter"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:gravity="bottom" >
<ImageView
android:id="#+id/imNFC"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_marginBottom="0dp"
android:layout_marginLeft="30dp"
android:contentDescription="#string/nfcimg"
android:src="#drawable/nfc" />
<ImageView
android:id="#+id/imNadra"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginBottom="00dp"
android:layout_marginRight="10dp"
android:contentDescription="#string/nadra"
android:src="#drawable/nadralogo" />
</RelativeLayout>
</LinearLayout>