Horiz LinearLayout containing two spinners not displayed - android-layout

I'm trying to assemble an Android display consisting of a seekBar at the bottom surmounted by two adjacent spinners contained in a horizontal linearLayout. It looks okay in the design view, but the two spinners fail to display in the running app.
I appreciate any help to isolate my stupidity.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:ads="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="com.example.android.rotiferian.MainActivity">
<!-- view for AdMob Banner Ad -->
<com.google.android.gms.ads.AdView
android:id="#+id/adView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
ads:adSize="BANNER"
ads:adUnitId="#string/banner_ad_unit_id" />
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="false"
android:layout_alignParentStart="true"
android:layout_marginStart="0dp"
android:layout_marginBottom="10dp"
android:layout_alignParentEnd="false"
android:id="#+id/linearLayout"
android:layout_marginEnd="0dp"
android:layout_above="#+id/seekBar"
android:visibility="visible">
<Spinner
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/spinnerLeft"
android:gravity="start"
style="#style/Base.Animation.AppCompat.DropDownUp"
android:popupBackground="#ff2f50"
android:background="#ce243f"
android:layout_weight="1"
android:visibility="visible"
android:layout_gravity="start" />
<Spinner
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/spinnerRight"
android:gravity="end"
style="#style/Base.Animation.AppCompat.DropDownUp"
android:background="#ff4eff2f"
android:popupBackground="#ff4eff2f"
android:paddingStart="20dp"
android:layout_weight="1"
android:visibility="visible"
android:layout_gravity="end" />
</LinearLayout>
<SeekBar
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/seekBar"
android:layout_centerVertical="true"
android:layout_centerHorizontal="true"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:splitTrack="false"
android:max="1000"
android:background="#00000000"
android:backgroundTint="#ff000000"/>

Related

Android listview with Color Border in vertical

I have been struggling for a while to draw vertical border.I want to use a ListView to make a report wheres the results is divided into squares and mixed up.Tried with multiple codes but could not, If any one can suggest the mistakes in my codings would be great.
Horizontal is working fine whereas vertical could not it.
Even with vertical in color do fine.
Current Listview Appears as follows :
Expected Listview format as follows: Vertical and Horizontal Border or Grid needed in between the contents.
Layout:
**
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#FFC7C7C7"
android:orientation="vertical"
android:divider="#drawable/mydivider"
android:showDividers="middle"
android:dividerPadding="22dp"
android:weightSum="9">
<LinearLayout
android:id="#+id/lvcontainer"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_alignParentTop="true"
android:layout_weight="0.5"
android:background="#FFC7C7C7"
android:orientation="horizontal"
android:padding="1dp"
android:weightSum="3">
<TextView
android:id="#+id/txtproductcompany"
style="?android:dividerVertical"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.63"
android:gravity="left"
android:text="no"
android:textColor="#000000"
android:textSize="13sp" />
<TextView
android:id="#+id/txtproductname"
style="?android:dividerVertical"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="0.59"
android:gravity="left"
android:padding="3dp"
android:text="number"
android:textColor="#000000"
android:textSize="9sp" />
<TextView
android:id="#+id/txtproductprice"
style="?android:dividerVertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:padding="3dp"
android:text="name"
android:textColor="#000000"
android:textSize="13sp" />
<TextView
android:id="#+id/txtproductprice1"
style="?android:dividerVertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:padding="3dp"
android:text="sun"
android:textColor="#000000"
android:textSize="13sp" />
<TextView
android:id="#+id/txtproductprice2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:padding="3dp"
android:text="mon"
android:textColor="#000000"
android:textSize="13sp" />
<TextView
android:id="#+id/txtproductprice3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="left"
android:padding="3dp"
android:text="tuesday"
android:textColor="#000000"
android:textSize="13sp" />
<TextView
android:id="#+id/txtproductprice4"
android:layout_width="56dp"
android:layout_height="wrap_content"
android:gravity="left"
android:padding="3dp"
android:text="wednesday"
android:textColor="#000000"
android:textSize="13sp" />
<TextView
android:id="#+id/txtproductprice5"
android:layout_width="45dp"
android:layout_height="wrap_content"
android:gravity="left"
android:padding="3dp"
android:text="thursday"
android:textColor="#000000"
android:textSize="13sp" />
<TextView
android:id="#+id/txtproductprice6"
android:layout_width="32dp"
android:layout_height="wrap_content"
android:gravity="left"
android:padding="3dp"
android:text="saturday"
android:textColor="#000000"
android:textSize="13sp" />
<TextView
android:id="#+id/txtproductprice7"
android:layout_width="33dp"
android:layout_height="wrap_content"
android:gravity="left"
android:padding="3dp"
android:text="closed"
android:textColor="#000000"
android:textSize="13sp" />
<TextView
android:id="#+id/txtproductprice8"
android:layout_width="21dp"
android:layout_height="wrap_content"
android:gravity="left"
android:padding="3dp"
android:text="calling"
android:textColor="#000000"
android:textSize="13sp"
android:layout_weight="0.60" />
<TextView
android:id="#+id/txtproductprice9"
android:layout_width="21dp"
android:layout_height="wrap_content"
android:gravity="left"
android:padding="3dp"
android:text="week"
android:textColor="#000000"
android:textSize="13sp"
android:layout_weight="6.22" />
</LinearLayout>
<ListView
android:id="#android:id/list"
android:layout_height="0dp"
android:layout_below="#+id/lvcontainer"
android:layout_weight="8.72"
android:layout_width="match_parent"
android:divider="#drawable/separator_line"
android:dividerHeight="4.0sp"
android:layout_marginTop="#dimen/activity_vertical_margin"
android:orientation="vertical"
android:dividerPadding="10dp"
android:layout_centerVertical="true"
android:showDividers="beginning|middle|end"
android:cacheColorHint="#00000000"
android:footerDividersEnabled="true"
android:headerDividersEnabled="true"
></ListView>
<TextView
android:id="#+id/txtresulttext"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_below="#android:id/list"
android:layout_marginLeft="5dp"
android:layout_marginTop="2dp"
android:layout_weight="0.5"
android:gravity="left"
android:text=""
android:textColor="#FFF55F54"
android:textSize="20sp"
android:textStyle="italic|bold"></TextView>
<LinearLayout
android:id="#+id/lvbottom"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_alignParentBottom="true"
android:layout_weight="1"
android:orientation="horizontal"
android:weightSum="1">
<Button
android:id="#+id/btnupload"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#1083f5"
android:gravity="center"
android:text="UPLOAD"
android:textColor="#ffffff"
android:textSize="15sp"
android:textStyle="bold"
android:visibility="invisible" />
</LinearLayout>
</LinearLayout>
**
Mycontroller:
myList = controller.getAllProducts();
if (myList.size() != 0) {
ListView lv = getListView();
ListAdapter adapter = new SimpleAdapter(import2.this, myList,
R.layout.display2, new String[]{ "id","number", "outletname","sunday", "tuesday" , "wednesday" ,"thursday", "saturday" , "monday","calling","closed"}, new int[]{
R.id.txtproductcompany,R.id.txtproductname,R.id.txtproductprice,R.id.txtproductprice1,R.id.txtproductprice2,R.id.txtproductprice3,R.id.txtproductprice4,R.id.txtproductprice5,R.id.txtproductprice6,R.id.txtproductprice7,R.id.txtproductprice8});
setListAdapter(adapter);
lbl.setText("");
}
code resutls.
Bar in the bottom,
same like this .
Since you want to show a table made of ListView rows, you have to make sure that columns will require the same space in each row.
Or you take an alternative approach and use TableLayout. It will be the better choice if you have a fixed number of rows.
But let's assume you have a varying number of rows. Then your layout for the rows will have to consist of rather rigid cells, so android:width="wrap_content" is not an option for most of the Views.
One way to cope with this is using a set of dimension values for the columns:
dimens.xml
<resources>
<dimen name="activity_vertical_margin">16dp</dimen>
<dimen name="column_id_width">32dp</dimen>
<dimen name="column_number_width">60dp</dimen>
<dimen name="column_outletname_width">60dp</dimen>
<dimen name="column_weekday_width">60dp</dimen>
<dimen name="column_closed_width">48dp</dimen>
<dimen name="column_calling_width">48dp</dimen>
<dimen name="column_week_width">48dp</dimen>
<dimen name="column_wednesday_width">76dp</dimen>
</resources>
... as well as a style for the individual TextViews
<style name="ListItemStyle" parent="TextAppearance.AppCompat.Body1">
<item name="android:textSize">12sp</item>
<item name="android:textColor">#000000</item>
<item name="android:padding">4dp</item>
<item name="android:gravity">center_horizontal</item>
<item name="android:background">#drawable/list_item_background</item>
</style>
with a shape drawable as list_item_background:
<shape xmlns:android="http://schemas.android.com/apk/res/android"
android:shape="rectangle">
<solid android:color="#android:color/transparent"/>
<stroke android:color="#000000" android:width="1dp"/>
</shape>
The list header:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="horizontal"
android:background="#aaaaaa"
android:foreground="#drawable/list_header_foreground"
android:layout_margin="2dp"
android:weightSum="1">
<TextView
style="#style/ListItemStyle"
android:id="#+id/txtproductcompany"
android:layout_width="#dimen/column_id_width"
android:layout_height="wrap_content"
android:text="id3"
android:background="#ffffff"/>
<TextView
style="#style/ListItemStyle"
android:id="#+id/txtproductname"
android:layout_width="#dimen/column_number_width"
android:layout_height="wrap_content"
android:text="number"/>
<TextView
style="#style/ListItemStyle"
android:id="#+id/txtproductprice"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="wrap_content"
android:text="outletname"/>
<TextView
style="#style/ListItemStyle"
android:id="#+id/txtproductprice1"
android:layout_width="#dimen/column_weekday_width"
android:layout_height="wrap_content"
android:text="sunday"/>
<TextView
style="#style/ListItemStyle"
android:id="#+id/txtproductprice2"
android:layout_width="#dimen/column_weekday_width"
android:layout_height="wrap_content"
android:text="monday"/>
<TextView
style="#style/ListItemStyle"
android:id="#+id/txtproductprice3"
android:layout_width="#dimen/column_weekday_width"
android:layout_height="wrap_content"
android:text="tuesday"/>
<TextView
style="#style/ListItemStyle"
android:id="#+id/txtproductprice4"
android:layout_width="#dimen/column_wednesday_width"
android:layout_height="wrap_content"
android:text="wednesday"/>
<TextView
style="#style/ListItemStyle"
android:id="#+id/txtproductprice5"
android:layout_width="#dimen/column_weekday_width"
android:layout_height="wrap_content"
android:text="thursday"/>
<!-- friday is missing on purpose? -->
<TextView
style="#style/ListItemStyle"
android:id="#+id/txtproductprice6"
android:layout_width="#dimen/column_weekday_width"
android:layout_height="wrap_content"
android:text="saturday"/>
<TextView
style="#style/ListItemStyle"
android:id="#+id/txtproductprice7"
android:layout_width="#dimen/column_closed_width"
android:layout_height="wrap_content"
android:text="closed"/>
<TextView
style="#style/ListItemStyle"
android:id="#+id/txtproductprice8"
android:layout_width="#dimen/column_calling_width"
android:layout_height="wrap_content"
android:text="calling"/>
<TextView
style="#style/ListItemStyle"
android:id="#+id/txtproductprice9"
android:layout_width="#dimen/column_week_width"
android:layout_height="wrap_content"
android:text="WEEK1"/>
</LinearLayout>
and, last not least, the list row
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="40dp"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="horizontal"
android:layout_margin="1dp"
android:weightSum="1">
<TextView
style="#style/ListItemStyle"
android:id="#+id/txtproductcompany"
android:layout_width="#dimen/column_id_width"
android:layout_height="match_parent"
android:text="13" />
<TextView
style="#style/ListItemStyle"
android:id="#+id/txtproductname"
android:layout_width="#dimen/column_number_width"
android:layout_height="match_parent"
android:text="9003562"/>
<TextView
style="#style/ListItemStyle"
android:id="#+id/txtproductprice"
android:layout_width="0dp"
android:layout_weight="1"
android:layout_height="match_parent"
android:text="1rmarket"/>
<TextView
style="#style/ListItemStyle"
android:id="#+id/txtproductprice1"
android:layout_width="#dimen/column_weekday_width"
android:layout_height="match_parent"
android:text="Sunday"/>
<TextView
style="#style/ListItemStyle"
android:id="#+id/txtproductprice2"
android:layout_width="#dimen/column_weekday_width"
android:layout_height="match_parent"
android:text="Monday"/>
<TextView
style="#style/ListItemStyle"
android:id="#+id/txtproductprice3"
android:layout_width="#dimen/column_weekday_width"
android:layout_height="match_parent"
android:text="Tuesday"/>
<TextView
style="#style/ListItemStyle"
android:id="#+id/txtproductprice4"
android:layout_width="#dimen/column_wednesday_width"
android:layout_height="match_parent"
android:text="Wednesday"/>
<TextView
style="#style/ListItemStyle"
android:id="#+id/txtproductprice5"
android:layout_width="#dimen/column_weekday_width"
android:layout_height="match_parent"
android:text="Thursday"/>
<!-- friday is missing on purpose? -->
<TextView
style="#style/ListItemStyle"
android:id="#+id/txtproductprice6"
android:layout_width="#dimen/column_weekday_width"
android:layout_height="match_parent"
android:text="No"/>
<TextView
style="#style/ListItemStyle"
android:id="#+id/txtproductprice7"
android:layout_width="#dimen/column_closed_width"
android:layout_height="match_parent"
android:text="Yes"/>
<TextView
style="#style/ListItemStyle"
android:id="#+id/txtproductprice8"
android:layout_width="#dimen/column_calling_width"
android:layout_height="match_parent"
android:lines="2"
android:text="0001\nDaily"/>
<TextView
style="#style/ListItemStyle"
android:id="#+id/txtproductprice9"
android:layout_width="#dimen/column_week_width"
android:layout_height="match_parent"
android:text="WEEK1"/>
</LinearLayout>
Note: you can use an attribute android:foreground with the LinearLayout in the list header if you want that green frame overlaying the child Views. Another shape drawable similar to list_item_background will do the trick.
Please note also that since I don't know your exact requirements, I left some of the attributes related to dividers alone. You may want to get rid of them if the approach based on shape drawables solves your issue.
The picture shows the Android Studio preview of the list header above a ListView placeholder
I changed the Activity layout to use less layout weights, and everything is set to android:visibility="visible" to make sure it all fits on the screen:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
xmlns:tools="http://schemas.android.com/tools"
android:background="#FFC7C7C7"
android:divider="#drawable/mydivider"
android:dividerPadding="2dp"
android:orientation="vertical"
android:showDividers="middle"
android:weightSum="1">
<include
android:id="#+id/lvcontainer"
layout="#layout/list_header"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#FFC7C7C7" />
<ListView
android:id="#android:id/list"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_marginTop="#dimen/activity_vertical_margin"
android:layout_weight="1"
android:cacheColorHint="#00000000"
android:divider="#drawable/separator_line"
android:dividerHeight="4.0sp"
android:dividerPadding="10dp"
android:footerDividersEnabled="true"
android:headerDividersEnabled="true"
android:orientation="vertical"
android:showDividers="beginning|middle|end" />
<TextView
android:id="#+id/txtresulttext"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="5dp"
android:layout_marginTop="2dp"
android:gravity="left"
android:text=""
tools:text="result"
android:textColor="#FFF55F54"
android:textSize="20sp"
android:textStyle="italic|bold" />
<LinearLayout
android:id="#+id/lvbottom"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="1">
<Button
android:id="#+id/btnupload"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="1"
android:background="#1083f5"
android:gravity="center"
android:text="UPLOAD"
android:textColor="#ffffff"
android:textSize="15sp"
android:textStyle="bold"
android:visibility="visible" />
</LinearLayout>
</LinearLayout>
As suggested by user 0X0nosugar created three layout. 1.main layout 2. listheader 3.listrow and applied rest matrix as suggested. now working fine
Use Views as borders in your adapter item layout. Use a recycler view instead.

Nested LinearLayout does not align to parent ScrollView?

I have a fragment with two horizontal Buttons (yellow = fragment_test_button_container) at the bottom of my fragment. I would like to use the remaining area (red = fragment_test_scrollview) for a ScrollView It is reuiqred that my ScrollView consist of one layout (turquoise = fragment_test_check) only . This can then in turn have further layouts, as you can see in the attached fragment_test.xml
<?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=".ui.TestFragment">
<ScrollView
android:id="#+id/fragment_test_scrollview"
android:layout_width="match_parent"
android:layout_height="0dp"
app:layout_constraintBottom_toTopOf="#id/fragment_test_button_container"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHeight_percent=".84"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent">
<LinearLayout
android:id="#+id/fragment_test_check"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<LinearLayout
android:id="#+id/fragment_test_front_photo_container"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight=".28"
android:orientation="horizontal">
<TextView
android:id="#+id/fragment_test_front_photo_title"
style="#style/myapp_MediumTextStyle"
android:layout_width="#dimen/myapp_test_fragment_textview_width"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginStart="24dp"
android:text="#string/fragment_test_front_photo_title_text" />
<ImageView
android:id="#+id/fragment_test_front_photo"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</LinearLayout>
<LinearLayout
android:id="#+id/fragment_test_back_photo_container"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight=".28"
android:orientation="horizontal">
<TextView
android:id="#+id/fragment_test_back_photo_title"
style="#style/myapp_MediumTextStyle"
android:layout_width="#dimen/myapp_test_fragment_textview_width"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginStart="24dp"
android:text="#string/fragment_test_back_photo_title_text" />
<ImageView
android:id="#+id/fragment_test_back_photo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical" />
</LinearLayout>
<!-- ADDITIONAL DATA -->
<LinearLayout
android:id="#+id/fragment_test_data_container"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight=".34"
android:orientation="vertical"
android:paddingStart="24dp"
android:paddingEnd="24dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/fragment_test_value1_label"
style="#style/myapp_MediumTextStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:text=„Value1^“ />
<TextView
android:id="#+id/fragment_test_value1_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginStart="24dp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/fragment_test_value2_label"
style="#style/myapp_MediumTextStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:text=„Value2“ />
<TextView
android:id="#+id/fragment_test_value2_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginStart="24dp" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<TextView
android:id="#+id/fragment_test_value3_label"
style="#style/myapp_MediumTextStyle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:text="Ausstellungsdatum" />
<TextView
android:id="#+id/fragment_test_value3_text"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:layout_marginStart="24dp" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</ScrollView>
<LinearLayout
android:id="#+id/fragment_test_button_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:paddingStart="24dp"
android:paddingEnd="24dp"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="#id/fragment_test_scrollview">
<Button
android:id="#+id/fragment_test_back_button"
style="#style/myapp_ContinueBackButtonStyle"
android:layout_width="0dp"
android:layout_height="#dimen/myapp_continueBackButton_height"
android:layout_weight="1"
android:background="#color/myapp_colorPrimary"
android:text=„back“
android:textColor="#FFFFFF" />
<Button
android:id="#+id/fragment_test_next_button"
style="#style/myapp_ContinueBackButtonStyle"
android:layout_width="0dp"
android:layout_height="#dimen/myapp_continueBackButton_height"
android:layout_marginStart="24dpVerySmall"
android:layout_weight="1"
android:background="#color/myapp_colorPrimary"
android:text="continue"
android:textColor="#FFFFFF" />
</LinearLayout>
</android.support.constraint.ConstraintLayout>
But my turqoise (fragment_test_check) area is not aligned fully with the blue area (fragment_test_scrollview), altough I wrote match_parent. I would like the heigth of turqoise area as the blue area.
Why is my turqoise area dangling in half the blue area?
Set android:fillViewport="true" in your ScrollView.
fillViewport stretches the content's height to the viewport's boundaries, when set true. In simple words, fillViewport decides whether the nested contents of the layout should match the parent's boundaries or not. Thus, to make the nested layout match the parent's boundary, set fillViewport to true
Moreover, the layout_gravity for nested components should be 1 or whatsoever you define in weight_sum of parent layout, whereas in your case it is 0.90 .

ScrollView overlapping other content in RelativeLayout

I have a drawer menu defined for my app that uses a RelativeLayout as its root.
The general structure of the menu is as follows:
<RelativeLayout
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:clickable="true"
android:focusable="true"
android:importantForAccessibility="no"
android:orientation="vertical">
<LinearLayout
android:id="#+id/linear_vert_drwr_hdr"
android:layout_width="match_parent"
android:layout_height="150dp"
android:padding="8dp"
android:background="#drawable/drawer_bg"
android:orientation="vertical">
<ImageView
... />
<TextView
... />
</LinearLayout>
<LinearLayout
android:id="#+id/manage_ids"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/linear_vert_drwr_hdr"
android:padding="8dp"
android:gravity="center_horizontal"
android:orientation="horizontal">
<TextView
... />
<ImageView
... />
</LinearLayout>
<LinearLayout
android:id="#+id/prefs_section"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/manage_ids"
android:padding="8dp"
android:gravity="center_horizontal"
android:orientation="horizontal">
<TextView
... />
</LinearLayout>
<ScrollView
android:id="#+id/vscroll_prefs"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#id/prefs_section"
android:paddingLeft="8dp"
android:paddingRight="8dp"
android:paddingBottom="8dp">
<LinearLayout
android:id="#+id/linear3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="8dp"
android:orientation="vertical"
android:layout_gravity="start">
<Switch
android:id="#+id/switch_rem_last_id"
android:layout_width="match_parent"
android:layout_height="wrap_content"
... />
... a bunch of switches ...
</LinearLayout>
</ScrollView>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:gravity="center_horizontal"
android:orientation="vertical">
<ImageView
android:id="#+id/i_div_line_top"
android:layout_width="match_parent"
android:layout_height="1dp"
android:contentDescription="#string/dividing_line"
android:paddingEnd="10dp"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:paddingStart="10dp"
app:srcCompat="#drawable/line_box" />
<TextView
... />
<TextView
... />
<ImageView
... />
<LinearLayout
android:id="#+id/social_links"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:orientation="horizontal">
<ImageView
... />
<ImageView
... />
</LinearLayout>
<TextView
android:id="#+id/l_app_version"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:padding="8dp"
android:text="#string/app_version"
android:textAlignment="center"
android:textColor="#000000"
android:textSize="12sp"
android:textStyle="italic" />
</LinearLayout>
</RelativeLayout>
This works fine on phones with large screens, but on smaller screens the ScrollView overlaps the LinearLayout below it.
As I'm using a RelativeLayout as the root of the layout I can't use android:layout_height="0dp" and android:layout_weight="1" instead of android:layout_height="wrap_content".
Is there another way to make the ScrollView expand to fill the available space but no more?
Got it.
I gave the LinearLayout below the ScrollView and id, then in the ScrollView I defined android:layout_above="#id/layout_below_the_scrollview".
Simple when you realise just how many android:layout... options there are!

Dressing a mannequin with different items in android

I am trying to implement similar screen. Unable to add different items at proper place. I want to add shoes at the proper place.
Layout
<?xml version="1.0" encoding="utf-8"?><RelativeLayout
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_weight="0.5"
android:padding="0dp">
<ImageView
android:id="#+id/imgBody"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:scaleType="fitXY"
android:src="#drawable/dress" />
<ImageView
android:id="#+id/imgFeet"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/imgBody"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="0dp"
android:src="#drawable/ic_shoe1"
android:visibility="gone" />
<ImageView
android:id="#+id/imgFace"
android:layout_width="50dp"
android:layout_height="wrap_content"
android:layout_marginLeft="55dp"
android:layout_marginTop="0dp"
android:src="#drawable/ic_head"
android:visibility="gone" />
<android.support.v7.widget.RecyclerView
android:id="#+id/recyclerView"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/white"/>
Try to user Table layout for split a screen in two part. like below :
Here i have use android:layout_weight="0.5" for screen size.
<TableLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#EBEBEB"
android:stretchColumns="2"
android:weightSum="2">
<TableRow
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="2">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="0.5"
android:background="#FFFFFF"
android:orientation="vertical">
<!--Write your xml Right side xml code here-->
</RelativeLayout>
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="fill_parent"
android:layout_weight="0.5"
android:background="#FFFFFF">
<!--Write your xml Left side xml code here-->
</RelativeLayout>
</TableRow>
</TableLayout>
Use Constraint Layout it will be easy for you to Design your Requirement
Add this dependency in your Project
compile 'com.android.support.constraint:constraint-layout:1.0.2'
Here I have added a code for your design
<?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">
<ImageView
android:id="#+id/imageView3"
android:layout_width="0dp"
android:layout_height="0dp"
android:scaleType="fitXY"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toLeftOf="#+id/guideline4"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintVertical_bias="1.0"
app:srcCompat="#drawable/splash" />
<android.support.constraint.Guideline
android:id="#+id/guideline4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.5"
tools:layout_editor_absoluteX="0dp"
tools:layout_editor_absoluteY="0dp" />
<android.support.design.widget.TabLayout
android:id="#+id/tabLayout"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:minHeight="55dip"
app:layout_constraintLeft_toLeftOf="#+id/guideline4"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent">
<android.support.design.widget.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Left" />
<android.support.design.widget.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Center" />
<android.support.design.widget.TabItem
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Right" />
</android.support.design.widget.TabLayout>
<Button
android:id="#+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Review"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintLeft_toLeftOf="#+id/guideline4"
app:layout_constraintRight_toRightOf="parent"
tools:layout_editor_absoluteX="265dp"
tools:layout_editor_absoluteY="463dp" />
<android.support.v7.widget.RecyclerView
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginBottom="0dp"
android:layout_marginLeft="0dp"
android:layout_marginRight="0dp"
android:layout_marginTop="0dp"
app:layout_constraintBottom_toTopOf="#+id/button"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintLeft_toLeftOf="#+id/guideline4"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toBottomOf="#+id/tabLayout"
app:layout_constraintVertical_bias="0.0" />
</android.support.constraint.ConstraintLayout>
I think instead of layout you should try to use canvas in left preview screen. On selecting any item should update left canvas by adding item in canvas and rendering elements.
Please have a look over canvas and drawing images over canvas.

Unwanted border at ImageView in RelativeLayout

I have been reading similar posts but none has solved my problem.
My Activity consists of this RelativeLayout:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TextView
android:id="#+id/initial_launch_text"
style="#style/initialLaunchTextStyle"
android:layout_width="match_parent"
android:layout_height="80dp"
android:layout_alignParentTop="true"
android:layout_margin="20dp"
android:gravity="center_horizontal|top"
android:text="Test" />
<Button
android:id="#+id/initial_launch_skip_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="10dp"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"
android:textColor="#color/initial_launch_skip_button_text"
android:onClick="skipButtonClicked"
android:text="#string/activity_initial_launch_skip_button_skip" />
<ImageView
android:id="#+id/initial_launch_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:layout_below="#+id/initial_launch_text"
android:layout_above="#+id/initial_launch_skip_button"
android:src="#drawable/flower"
android:adjustViewBounds="true"
android:background="#000000"
android:padding="1dp" />
</RelativeLayout>
All I want is a TextView on top, a Button at the bottom and an ImageView with 1dp black border in between. But what I get is an unwanted thick black border above and below the image:
How can I get rid of that??
Change this:
<ImageView
android:id="#+id/initial_launch_image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:layout_below="#+id/initial_launch_text"
android:layout_above="#+id/initial_launch_skip_button"
android:src="#drawable/flower"
android:adjustViewBounds="true"
android:background="#000000"
android:padding="1dp" />
to this:
<ImageView
android:id="#+id/initial_launch_image"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:layout_below="#+id/initial_launch_text"
android:layout_above="#+id/initial_launch_skip_button"
android:src="#drawable/flower"
android:adjustViewBounds="true"
android:background="#000000"
android:layout_margin="1dp" />
I designed this layout for you but it has one issue with this type of issues why am saying this means you are going with PNG file you may get two types of layout i will show the layouts you should use JPEG then only you can get this type of layouts....
Layout code.....
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="match_parent" >
<TextView
android:id="#+id/initial_launch_text"
android:layout_width="match_parent"
android:layout_height="80dp"
android:layout_alignParentTop="true"
android:layout_margin="20dp"
android:gravity="center_horizontal|top"
android:text="Test" />
<Button
android:id="#+id/initial_launch_skip_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:onClick="skipButtonClicked"
android:text="Skip"
android:textColor="#android:color/black" />
<ImageView
android:id="#+id/initial_launch_image"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/initial_launch_skip_button"
android:layout_below="#+id/initial_launch_text"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:adjustViewBounds="true"
android:background="#000000"
android:padding="5dp"
android:scaleType="fitXY"
android:src="#drawable/logo" />
</RelativeLayout>
Wrapping the ImageView with a LinearLayout using following parameters did the trick:
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true" >
<ImageView
android:id="#+id/initial_launch_image"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_centerInParent="true"
android:layout_below="#+id/initial_launch_text"
android:layout_above="#+id/initial_launch_skip_button"
android:src="#drawable/flower"
android:background="#000000"
android:padding="1dp"
android:adjustViewBounds="true" />
</LinearLayout>

Resources