Develop Reference

What element type i need to use similar to LinearLayout

I am pretty new to Android, but just trying to develop a small application similar to "User survey"
User is displayed with multiple questions(Activity1), once he answers all questions a Summary of questions with selected options needs to be displayed(Activity2).
I wanted to use some element/container like LinearLayout, which holds Questions and Options with some border to separate each question. Here Android wont allow more than one LinerLayout.
So is there any other element type similar to LinearLayout that is useful here?

You can provide style to your linear layout with border and place it in drawable. after that you can set background for linear layout. The file under drawable can be writen as follows
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners
android:radius="2dp"
android:topRightRadius="0dp"
android:bottomRightRadius="0dp"
android:bottomLeftRadius="0dp" />
<stroke
android:width="1dp"
android:color="#android:color/white" />
</shape>

Make root layout, within it make another two layout which contains your questions and result elements, make one of some visibility invisible which you don't need at this moment, then do the same for other.

You can use TableLayout and customize your view accordingly.
Since you have to display a list of questions and answers please add views programmatically. It will create less code and quite readable and you do need to add layout every time for a new question.

If you are really new to android, and you want just to throw view inside of it, meaning, add CheckedTextView's inside of a vertical oriented LinearLayout, and that LinearLayout to be inside of a ScrollView. Also maybe checkout this link, ths may help you do what you need:
https://developer.android.com/training/material/lists-cards.html

Android does allow multiple LinearLayouts.You just have to place them in the right place. You can also use the combination of relative and linear layouts. or you can do like this :
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Question1"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Option1"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Option2"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Option3"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Option4"/>
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Question2"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Option1"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Option2"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Option3"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Option4"/>
</LinearLayout>
</LinearLayout>
You can also use constraint layout to position your views.Get the detailed info about contraint layout from here : https://medium.com/exploring-android/exploring-the-new-android-constraintlayout-eed37fe8d8f1

Android: Why is my background image of the layout zoomed in and blurred?

I'm making an easy chatting app and I made a .9.png pic as the speech bubble. Here's a part of the message item layout XML (the bubble sent by user):
<LinearLayout
android:id="#+id/right_layout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
android:background="#drawable/bg_send">
<TextView
android:id="#+id/right_msg"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_margin="10dp"
android:textColor="#color/abc_primary_text_material_dark"/>
</LinearLayout>
The #drawable/bg_send is a 102px*102px .9.png file at app\res\. I thought it should be small displaying on my 5" 1920*1080 phone. But it's bigger than it should be and that caused blurring.
What should I do if I want to make it as I wish?

Instead of using .9.png use the drawable images instead. Here is the xml code that will fulfill your requirement.
res/drawable/bg_textview.xml
<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#607D8B"/>
<corners android:radius="30dp"/>
</shape>

The image stretches to the size of of your LinearLayout (for which it is the background). The margin around the TextView makes the LinearLayout bigger. Move the android:layout_margin="10dp" attribute to the LinearLayout to have a margin around the bubble.

Try this one
<LinearLayout
android:id="#+id/right_layout"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="right"
>
<TextView
android:id="#+id/right_msg"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_margin="10dp"
android:background="#drawable/bg_send"
android:textColor="#color/abc_primary_text_material_dark"/>
Good luck

Can't align image view properly in relative layout

I want to show the image aligned to the top in the relative layout and the shadow should be around the image and not around the layout. What is going wrong I can't understand.
<RelativeLayout
android:layout_width="117dp"
android:layout_height="162dp">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:src="#drawable/rectangle"
android:background="#drawable/drop_shadow"/>
</RelativeLayout>
This is how the image looks when preview in design mode. notice the white background that is coming because of drop shadow and it looks like eventhough the actual image is smaller but the imageview is taking relative layout parameters to drop shadow. Any help is appreciated.

<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/selector">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:src="#drawable/ic_launcher" />
</RelativeLayout>
Here selector file:
<shape xmlns:android="http://schemas.android.com/apk/res/android">
<stroke
android:width="1dp"
android:color="#000000" />
</shape>
Hope this might help.

Looks like you just need add the adjustViewBounds property. That property defaults to false...
<RelativeLayout
android:layout_width="117dp"
android:layout_height="162dp">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:adjustViewBounds="true" <-- ADD THIS
android:src="#drawable/rectangle"
android:background="#drawable/drop_shadow"/>
</RelativeLayout>

How to create a custom view with rounded edges and two textviews?

I want to create a view like image below. My implementation has some linearLayouts. One root with a custom drawable to get the rounded edges and then others for the two textviews and view divider. Is there a faster and easier way to do this?

You can do this with just 1 LinearLayout, the root one. The LinearLayout is used just to order other views. So, what you need to do is to use the vertical orientation and add two text views.
On the first one you set the background color to a light gray. And remember to use the gravity as center so your text will be placed on the center of the text view.

I dont have much time, just tried to give a quick sample. Here's my code for your question:
your_main_layout.xml
<?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:background="#drawable/your_bg.xml">
<TextView
android:id="#+id/tv1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="my text" />
<View
android:id="#+id/seperator
android:layout_width="match_parent"
android:layout_height="1dp"
android:layout_below="#+id/tv1" />
<TextView
android:id="#+id/tv2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="2nd text here"
android:layout_below="#+id/seperator" />
</RelativeLayout>
your_bg.xml
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<corners
android:radius="5dp"
/>
<solid android:color="#fff" />
<stroke android:color="#000" />
</shape>

Create border around a centered custom view and removing useless LinearLayout?

Currently I have following layout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/editorRootView"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<RelativeLayout android:id="RL1"
android:layout_width="fill_parent"
android:layout_height="0dip"
android:layout_weight="1">
<!-- LinearLayout needed so we have an border outside of the EditorView -->
<LinearLayout android:id="LL1"
android:background="#drawable/border"
android:layout_centerInParent="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content" >
<xenolupus.EditorView
android:id="#+id/editorView"
android:layout_width="300dip"
android:layout_height="216dip" />
</LinearLayout>
</RelativeLayout>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_margin="10dip"
android:orientation="horizontal" >
<Button
android:id="#+id/otherImage"
android:layout_width="150dip"
android:layout_height="60dip"
android:text="#string/cardEditor_OtherImageButtonText" />
<Button
android:id="#+id/next"
android:layout_width="150dip"
android:layout_height="60dip"
android:text="#string/cardEditor_NextButtonText" />
</LinearLayout>
</LinearLayout>
And the used #drawable/border:
<?xml version="1.0" encoding="UTF-8"?>
<shape
xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid
android:color="#FFFFFF" />
<stroke
android:width="10dip"
android:color="#FF0099CA" />
<padding
android:left="10dip"
android:top="10dip"
android:right="10dip"
android:bottom="10dip" />
<corners
android:radius="5dip" />
</shape>
However Eclipse warns me (yellow triangle with !) that the LinearLayout LL1 in the RelativeLayout RL1 is useless and should be removed:
This LinearLayout layout or its RelativeLayout parent is useless;
transfer the background attribute to the other view.
As the RelativeLayout is needed to center the EditorView I tried removing the LinearLayout LL1 and adding the android:background of the LinearLayout LL1 to the EditorView. However doing lets the border disappear behind the content of the EditorView.
Is there another way to add a border outside of the EditorView or should I just ignore the warning?
Greetings
Xeno Lupus

yes it's right, put the background inside your <xenolupus.EditorView
like this
<xenolupus.EditorView
android:background="#drawable/border"
android:padding="10dp"
android:id="#+id/editorView"
android:layout_width="300dip"
android:layout_height="216dip" />
and then add gravity to it parent the RL1 layout
> android:gravity="center"

View can draw background by default. If you developed you EditorView correctly, you can just set background and paddings directly in XML:
<xenolupus.EditorView
android:id="#+id/editorView"
android:layout_width="300dip"
android:layout_height="216dip"
android:background="#drawable/border"
android:padding="10dp" />
By "developed correctly" I mean that your view calculate it's width in height (in onMeasure or onSizeChanged methods) with paddings. In other words: while calculating size you used getPadding*() methods.
NOTE
Do not forget to call super.onDraw() !