I have this image(#drawable/engines_bg), as my Horizontal Scroll view:
you can see the triangle is in the exact middle.
However, when I run my Activity, the triangle is closed to the left:
(if you measure with a roller)
how can it be?
I have checked and there is no re-positioning in the code.
here is my xml:
<com.w.view.title.TitleBar
android:id="#+id/titleBar"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<ListView
android:id="#+id/searchResultsList"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:layout_above="#+id/searchButtonBar"
android:layout_below="#id/titleBar"
android:cacheColorHint="#00000000"
android:divider="#null"
android:fadingEdge="none"
android:scrollbars="none" />
<com.w.navigate.SearchButtonsBarHorizontalScrollView
android:id="#+id/searchButtonBar"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#drawable/engines_bg"
android:fadingEdge="horizontal"
android:gravity="center"
android:padding="0dp"
android:scrollbars="none" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:orientation="horizontal"
android:paddingTop="25dp" >
<ImageButton
android:id="#+id/leftMargin"
android:layout_width="160dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/search_engine_button"
android:visibility="invisible" />
<ImageButton
android:id="#+id/searchButton1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/search_engine_button"
android:onClick="engineClicked" />
<ImageButton
android:id="#+id/searchButton2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/search_engine_button"
android:onClick="engineClicked" />
<ImageButton
android:id="#+id/rightMargin"
android:layout_width="160dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/search_engine_button"
android:visibility="invisible" />
</LinearLayout>
</com.w.navigate.SearchButtonsBarHorizontalScrollView>
<LinearLayout
android:id="#+id/searchProgressPopup"
android:layout_width="180dp"
android:layout_height="140dp"
android:layout_centerInParent="true"
android:background="#drawable/semi_transparent_bg"
android:gravity="center_horizontal"
android:orientation="vertical"
android:visibility="invisible" >
<com.w.view.map.ProgressAnimation
android:id="#+id/searchProgressAnimation"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:layout_weight="1" />
<TextView
android:id="#+id/searchProgressText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginBottom="5dp"
android:gravity="center"
android:textColor="#FFFFFF" />
</LinearLayout>
<ImageView
android:layout_width="match_parent"
android:layout_height="6dp"
android:layout_below="#id/titleBar"
android:scaleType="fitXY"
android:src="#drawable/topbar_shadow" />
update:
I have tried #Brian's solution, but it's all mixed up:
<com.w.view.title.TitleBar
android:id="#+id/titleBar"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<ListView
android:id="#+id/searchResultsList"
android:layout_width="fill_parent"
android:layout_height="match_parent"
android:layout_above="#+id/searchButtonBarWrapper"
android:layout_below="#id/titleBar"
android:cacheColorHint="#00000000"
android:divider="#null"
android:fadingEdge="none"
android:scrollbars="none" />
<LinearLayout
android:id="#+id/searchButtonBarWrapper"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#drawable/engines_bg"
android:orientation="horizontal" >
<com.w.navigate.SearchButtonsBarHorizontalScrollView
android:id="#+id/searchButtonBar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:fadingEdge="horizontal"
android:gravity="center"
android:padding="0dp"
android:scrollbars="none" >
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_horizontal"
android:orientation="horizontal"
android:paddingTop="25dp" >
<ImageButton
android:id="#+id/leftMargin"
android:layout_width="160dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/search_engine_button"
android:visibility="invisible" />
<ImageButton
android:id="#+id/searchButton1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/search_engine_button"
android:onClick="engineClicked" />
<ImageButton
android:id="#+id/searchButton2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/search_engine_button"
android:onClick="engineClicked" />
<ImageButton
android:id="#+id/searchButton3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/search_engine_button"
android:onClick="engineClicked" />
<ImageButton
android:id="#+id/searchButton4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/search_engine_button"
android:onClick="engineClicked" />
<ImageButton
android:id="#+id/searchButton5"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/search_engine_button"
android:onClick="engineClicked" />
<ImageButton
android:id="#+id/rightMargin"
android:layout_width="160dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:background="#drawable/search_engine_button"
android:visibility="invisible" />
</LinearLayout>
</com.w.navigate.SearchButtonsBarHorizontalScrollView>
</LinearLayout>
<LinearLayout
android:id="#+id/searchProgressPopup"
android:layout_width="180dp"
android:layout_height="140dp"
android:layout_centerInParent="true"
android:background="#drawable/semi_transparent_bg"
android:gravity="center_horizontal"
android:orientation="vertical"
android:visibility="invisible" >
<com.w.view.map.ProgressAnimation
android:id="#+id/searchProgressAnimation"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:layout_weight="1" />
<TextView
android:id="#+id/searchProgressText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginBottom="5dp"
android:gravity="center"
android:textColor="#FFFFFF" />
</LinearLayout>
<ImageView
android:layout_width="match_parent"
android:layout_height="6dp"
android:layout_below="#id/titleBar"
android:scaleType="fitXY"
android:src="#drawable/topbar_shadow" />
The result:
Uapdte2: Tried Luksprog's 9.png
I had two problems:
1) the 1 pixel dots are visible
2) the arrow is to strached
3) I sae the original 9.png in two folders. How can I know which one my device relates to?
Your nine patch image is too big to be handled by the ScrollView so the arrow doesn't get in the middle where you'd want it. So make the nine patch image smaller in width(that would be one of the advantages of nine patches vs regular images) by simply taking out two equal chunks from the left and right of the arrow and also adding the stretch points(which should be equal so the image gets stretched proportionally).
Here's my attempt(which should be saved as the_image_etc.9.png):
If you miss transparency somewhere it may be due to me saving that wrong but the general approach of obtaining the image is above.
I save the original 9.png in two folders. How can I know which one my
device relates to?
When using a nine patch you need to have a version for each of the density drawable folders(so the image itself doesn't get resized using the image from another density folder), you don't need versions for different sizes of the screens(that's what is great about nine patches, they take out the size issue by extending themselves).
Related
I have recycleView in my project . I have a imageview (handle like action), while i want to like my post it click and when I want to dislike my post , Just my first item click .
I change haight of my item to match parent, it works for the rest of items . But my view is match parent and appearance of layout is not good.
here is my xml :
<RelativeLayout 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:layout_marginEnd="2dp"
android:layout_marginStart="2dp"
android:layout_marginTop="2dp"
>
<ImageView
android:id="#+id/imageView"
android:layout_width="match_parent"
android:layout_height="180dp"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:adjustViewBounds="true"
android:background="?attr/selectableItemBackgroundBorderless"
android:clickable="false"
android:maxHeight="160dp"
android:scaleType="centerCrop" />
<View
android:layout_width="match_parent"
android:layout_height="180dp"
android:background="#drawable/gradient_background" />
<TextView
android:id="#+id/post_title"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:ellipsize="marquee"
android:gravity="right"
android:maxLines="2"
android:paddingBottom="4dp"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:paddingTop="16dp"
android:shadowColor="#color/text_shadow"
android:shadowDx="1"
android:shadowDy="1"
android:shadowRadius="2"
android:textColor="#color/white"
android:textSize="18sp"
tools:text="Title" />
<TextView
android:id="#+id/post_category"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_below="#id/post_title"
android:paddingBottom="4dp"
android:paddingEnd="16dp"
android:paddingStart="16dp"
android:shadowColor="#color/text_shadow"
android:shadowDx="1"
android:shadowDy="1"
android:shadowRadius="2"
android:textAllCaps="true"
android:textColor="#android:color/white"
android:textSize="14sp"
tools:text="Hello World" />
<ProgressBar
android:id="#+id/progress"
style="#android:style/Widget.DeviceDefault.Light.ProgressBar.Small"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:visibility="visible"
tools:visibility="visible" />
<LinearLayout
android:id="#+id/actions_ll"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignBottom="#id/imageView"
android:layout_alignParentRight="true"
android:gravity="start"
android:orientation="horizontal">
<ImageView
android:id="#+id/share_button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:padding="16dp"
android:tint="#android:color/white"
app:srcCompat="#drawable/ic_share" />
<ImageView
android:id="#+id/like"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:padding="16dp"
/>
</LinearLayout>
</RelativeLayout>
If I put wrap_content ,it doesn't work correct and just first item is clickable.
Any idea?
In adapter view, you should always keep width as wrap_content. If still you require width to be match_parent, please post your question in understandable words.
I am working on an Android application in which I have a RatingBar. Currently for testing, I am setting its value randomly between 1-5. For some reason, the rating bar is always starting from center, and is never occupying the complete space available. Here is how it looks in the app :
The entire space left of rating bar is what I have given in XML, but it's not getting filled.
One other problem with Rating bar is, how can I add a text to left of the RatingBar. Something like Text...(XXXXX). Thank you
Code :
<RatingBar
android:layout_width="135dp"
android:layout_height="40dp"
android:id="#+id/productStars"
android:numStars="5"
android:scaleX="0.3"
android:scaleY="0.3"
android:stepSize="1"
android:layout_alignWithParentIfMissing="false"
android:paddingLeft="20dp"
android:layout_alignParentBottom="true"
android:layout_alignRight="#+id/description"
android:layout_alignEnd="#+id/description" />
Update
Entire layout :
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:descendantFocusability="blocksDescendants"
android:orientation="horizontal"
android:padding="5dip"
android:background="#color/common_action_bar_splitter"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:layout_marginLeft="5dp"
android:layout_marginStart="5dp"
android:layout_marginTop="5dp"
android:layout_marginBottom="5dp"
android:layout_marginRight="5dp"
android:layout_marginEnd="5dp"
>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="150dp"
>
<ImageView
android:layout_width="150dp"
android:layout_height="200dp"
android:id="#+id/productImage"
android:background="#drawable/layout_image"
/>
<TextView
android:id="#+id/comments"
android:layout_width="50dp"
android:layout_height="35dp"
android:textAppearance="?android:attr/textAppearanceMedium"
android:textColor="#color/abc_input_method_navigation_guard"
android:gravity="left"
android:singleLine="true"
android:layout_marginStart="4dp"
android:layout_marginLeft="4dp"
android:layout_above="#+id/productStars"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
android:layout_alignLeft="#+id/description"
android:layout_alignStart="#+id/description" />
<TextView
android:id="#+id/productName"
android:layout_width="match_parent"
android:layout_height="40dp"
android:gravity="left"
android:scrollHorizontally="true"
android:visibility="visible"
android:layout_toEndOf="#+id/productImage"
android:layout_toRightOf="#+id/productImage"
android:textColor="#color/abc_input_method_navigation_guard"
android:typeface="monospace"
android:layout_marginStart="5dp"
android:layout_marginLeft="5dp"
android:singleLine="true"
/>
<TextView
android:id="#+id/description"
android:layout_width="match_parent"
android:layout_height="30dp"
android:layout_gravity="center_horizontal|top"
android:ellipsize="end"
android:singleLine="true"
android:gravity="left"
android:scrollHorizontally="true"
android:visibility="visible"
android:layout_above="#+id/comments"
android:layout_toEndOf="#+id/productImage"
android:layout_below="#+id/productName"
android:layout_toRightOf="#+id/productImage"
android:textColor="#color/abc_input_method_navigation_guard"
android:layout_marginStart="5dp"
android:layout_marginLeft="5dp"
android:layout_marginRight="3dp"
android:layout_marginEnd="3dp" />
<RatingBar
android:layout_width="135dp"
android:layout_height="40dp"
android:id="#+id/productStars"
android:numStars="5"
android:scaleX="0.3"
android:scaleY="0.3"
android:stepSize="1"
android:layout_alignWithParentIfMissing="false"
android:layout_alignParentBottom="true"
android:layout_alignRight="#+id/description"
android:layout_alignEnd="#+id/description" />
<ImageButton
android:layout_width="45dp"
android:layout_height="45dp"
android:id="#+id/swapButton"
android:src="#drawable/swappossible"
android:background="#null"
android:layout_alignParentBottom="true"
android:layout_toLeftOf="#+id/productStars"
android:layout_toStartOf="#+id/productStars" />
</RelativeLayout>
</LinearLayout>
</RelativeLayout>
Try to replace your rating bar with this
<RatingBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/productStars"
android:stepSize="1"
android:numStars="5"
style="?android:attr/ratingBarStyleSmall"
android:layout_alignRight="#+id/description"
android:layout_alignEnd="#+id/description" />
Don't give fix width to rating bar, keep it wrap_content. To make rating bar smaller use this instead
style="?android:attr/ratingBarStyleSmall"
Add this to your rating bar
According to your code it should be like this
<RatingBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/productStars"
android:numStars="5"
style="?android:attr/ratingBarStyleSmall"
android:stepSize="1"
android:layout_alignWithParentIfMissing="false"
android:layout_alignParentBottom="true"
android:layout_alignRight="#+id/description"
android:layout_alignEnd="#+id/description"
android:layout_gravity="center"/>
Make height wrap_content too and remove scaleX and scaleY too
I've made a lay-out with 10 buttons. In those buttons i have icons, showing what the information inside is about. Under those buttons, I want to have a word to clearify that again.
I have no idea how to add textviews and place them exactly under those buttons. I have tried it from the lay-out, by just pressing Textview and put it under the buttons, but that way my entire lay-out goes downwards, and the position is not right under it, but slightly left of it.
Hope someone can help me, every kind of help is appreciated.
This is my layout, the red circles are where I want the text to be.
Click here to see the image
This is my code:
<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="vertical"
tools:context="com.example.rodekruis.MainActivity"
android:background="#drawable/rkzafbeelding">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
tools:context="com.example.rodekruis.MainActivity">
<FrameLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/imageButton1"
android:layout_width="40dp"
android:layout_height="50dp"
android:layout_marginBottom="20dp"
android:layout_marginRight="40dp"
android:layout_marginTop="10dp"
android:layout_gravity="right"
android:src="#drawable/informatiebutton" />
<ImageView
android:layout_marginBottom="50dp"
android:layout_width="150dp"
android:layout_height="100dp"
android:layout_marginLeft="1dp"
android:layout_marginTop="1dp"
android:scaleType="fitStart"
android:src="#drawable/logoversiejuni" />
</FrameLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginBottom="20dp"
android:layout_marginTop="0dp"
android:orientation="horizontal">
<ImageButton
android:id="#+id/button10"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_alignTop="#+id/button10"
android:layout_marginRight="5dp"
android:layout_marginLeft="2dp"
android:layout_weight="1"
android:layout_marginTop="0dp"
android:adjustViewBounds="true"
android:padding="5dp"
android:scaleType="fitCenter"
android:src="#drawable/afspraakbutton"
android:text=" Afspraak maken" />
<ImageButton
android:id="#+id/button8"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_alignTop="#+id/button8"
android:layout_marginRight="5dp"
android:layout_marginLeft="2dp"
android:layout_weight="1"
android:layout_marginTop="0dp"
android:adjustViewBounds="true"
android:padding="5dp"
android:scaleType="fitCenter"
android:src="#drawable/bezoektijdenbutton"
android:text=" Bezoek tijden" />
<ImageButton
android:id="#+id/button9"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_alignTop="#+id/button8"
android:layout_marginRight="5dp"
android:layout_marginLeft="2dp"
android:layout_weight="1"
android:layout_marginTop="0dp"
android:adjustViewBounds="true"
android:padding="5dp"
android:scaleType="fitCenter"
android:src="#drawable/contactbutton"
android:text=" Contact" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginTop="10dp"
android:layout_marginBottom="20dp"
android:orientation="horizontal">
<ImageButton
android:id="#+id/button3"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_alignTop="#+id/button8"
android:layout_marginRight="5dp"
android:layout_marginLeft="2dp"
android:layout_weight="1"
android:layout_marginTop="0dp"
android:adjustViewBounds="true"
android:padding="5dp"
android:scaleType="fitCenter"
android:src="#drawable/routebutton"
android:text="Route" />
<ImageButton
android:id="#+id/button4"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_alignTop="#+id/button8"
android:layout_marginRight="5dp"
android:layout_marginLeft="2dp"
android:layout_weight="1"
android:layout_marginTop="0dp"
android:adjustViewBounds="true"
android:padding="5dp"
android:scaleType="fitCenter"
android:src="#drawable/meningbutton"
android:text="Uw mening" />
<ImageButton
android:id="#+id/button1"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_alignTop="#+id/button8"
android:layout_marginRight="5dp"
android:layout_marginLeft="2dp"
android:layout_weight="1"
android:layout_marginTop="0dp"
android:adjustViewBounds="true"
android:padding="5dp"
android:scaleType="fitCenter"
android:src="#drawable/vriendenbutton"
android:text="Word vriend" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginTop="10dp"
android:orientation="horizontal">
<ImageButton
android:id="#+id/button5"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_alignTop="#+id/button8"
android:layout_marginRight="5dp"
android:layout_marginLeft="2dp"
android:layout_weight="1"
android:layout_marginTop="0dp"
android:adjustViewBounds="true"
android:padding="5dp"
android:scaleType="fitCenter"
android:src="#drawable/foldersbutton"
android:text="Folders" />
<ImageButton
android:id="#+id/button6"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_alignTop="#+id/button8"
android:layout_marginRight="5dp"
android:layout_marginLeft="2dp"
android:layout_weight="1"
android:layout_marginTop="0dp"
android:adjustViewBounds="true"
android:padding="5dp"
android:scaleType="fitCenter"
android:src="#drawable/specialistenbutton"
android:text="Specialisten" />
<ImageButton
android:id="#+id/button7"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_alignTop="#+id/button8"
android:layout_marginRight="5dp"
android:layout_marginLeft="2dp"
android:layout_weight="1"
android:layout_marginTop="0dp"
android:adjustViewBounds="true"
android:padding="5dp"
android:scaleType="fitCenter"
android:src="#drawable/bwcbutton"
android:text="Brandwond encentrum" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginTop="30dp"
android:orientation="horizontal">
<ImageButton
android:id="#+id/button2"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_alignTop="#+id/button8"
android:layout_marginRight="5dp"
android:layout_marginLeft="2dp"
android:layout_weight="1"
android:layout_marginTop="0dp"
android:adjustViewBounds="true"
android:padding="5dp"
android:scaleType="fitCenter"
android:src="#drawable/nieuwsbutton"
android:text="Nieuws en Agenda" />
</LinearLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="50dp"
android:layout_marginTop="30dp"
android:layout_marginBottom="40dp"
android:orientation="horizontal">
<ImageButton
android:id="#+id/button11"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_alignTop="#+id/button8"
android:layout_marginRight="5dp"
android:layout_marginLeft="2dp"
android:layout_weight="1"
android:layout_marginTop="0dp"
android:adjustViewBounds="true"
android:padding="5dp"
android:scaleType="fitCenter"
android:src="#drawable/afspraakbutton"
android:text="Facebook" />
<ImageButton
android:id="#+id/button12"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_alignTop="#+id/button8"
android:layout_marginRight="5dp"
android:layout_marginLeft="2dp"
android:layout_weight="1"
android:layout_marginTop="0dp"
android:adjustViewBounds="true"
android:padding="5dp"
android:scaleType="fitCenter"
android:src="#drawable/afspraakbutton"
android:text="Youtube" />
<ImageButton
android:id="#+id/button13"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_alignTop="#+id/button8"
android:layout_marginRight="5dp"
android:layout_marginLeft="2dp"
android:layout_weight="1"
android:layout_marginTop="0dp"
android:adjustViewBounds="true"
android:padding="5dp"
android:scaleType="fitCenter"
android:src="#drawable/afspraakbutton"
android:text="Twitter" />
<ImageButton
android:id="#+id/button14"
style="?android:attr/buttonStyleSmall"
android:layout_width="0dp"
android:layout_height="match_parent"
android:layout_alignTop="#+id/button8"
android:layout_marginRight="5dp"
android:layout_marginLeft="2dp"
android:layout_weight="1"
android:layout_marginTop="0dp"
android:adjustViewBounds="true"
android:padding="5dp"
android:scaleType="fitCenter"
android:src="#drawable/afspraakbutton"
android:text="LinkedIn" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
You can try just using TextViews in your layout and add the icons to them as compound drawables using:
textView.setCompoundDrawables(null, yourIconDrawable, null, null);
This will put your drawable to the top of the text. To set the size of the drawable call setBounds(...) on it or use setCompoundDrawablesWithIntrinsicBounds(...) on the TextView. You can also set the padding with setCompoundDrawablePadding(int padding).
Can you try this code and check if it works?
<TextView
android:id="#+id/TextView"
android:layout_width="50dp"
android:layout_height="30dp" --> you can change the size that you want
android:layout_below="#+id/imageButton1" --> you can change the size that you want
android:textAlignment="center" />
Try this but this the not The right way to create this type of view the best way to create Using GridView
<LinearLayout
android:weightSum="3"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="113dp">
<LinearLayout
android:layout_weight="1"
android:orientation="vertical"
android:layout_width="100dp"
android:layout_height="100dp">
<ImageButton
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_gravity="center_horizontal"
android:src="#mipmap/ic_launcher"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Title "/>
</LinearLayout>
<LinearLayout
android:layout_weight="1"
android:orientation="vertical"
android:layout_width="100dp"
android:layout_height="100dp">
<ImageButton
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_gravity="center_horizontal"
android:src="#mipmap/ic_launcher"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Title "/>
</LinearLayout>
<LinearLayout
android:layout_weight="1"
android:orientation="vertical"
android:layout_width="100dp"
android:layout_height="100dp">
<ImageButton
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_gravity="center_horizontal"
android:src="#mipmap/ic_launcher"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:gravity="center"
android:text="Title "/>
</LinearLayout>
</LinearLayout>
There are a lot of ways to achieve that, one of the most common ways is to use FrameLayout, and another common way is by using RelativeLayout which will give you the ability to predefine the views positions according to eachother(i.e which one is above the other), and following is a good example about how to use RelativeLayout to achieve your purpose:
<RelativeLayout
android:id="#+id/RelativeLayout1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical" >
<!-- Add Button 1 -->
<Button
android:id="#+id/button1"
android:layout_width="200dp"
android:layout_height="200dp"
android:layout_alignParentTop="true"
android:src="#drawable/image1" />
<!-- Add Text 1 -->
<TextView
android:id="#+id/text1"
android:layout_width="100dp"
android:layout_height="50dp"
android:layout_below="#id/button1"
android:text="text1" />
</RelativeLayout>
I've tried everything I can think of but can't get this layout working. It's a ListView that list matches in a row.
Row one is first match, and next row is second match, and so on. I don't don't mind the green strokes and borders.
Is it even possible?
See the deisgn here:
Here's an example implementation, it does however use negative margins, to overlap the thing I called badge.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#cdcdcd"
android:gravity="center_vertical">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toLeftOf="#+id/score"
android:layout_below="#+id/badge"
android:background="#color/white"
android:orientation="vertical"
android:padding="16dp"
android:showDividers="middle">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView 1"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView 2"/>
</LinearLayout>
<TextView
android:id="#+id/score"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:padding="16dp"
android:text="0 vs 7"
android:layout_below="#+id/badge"
android:textSize="32sp"
android:textStyle="bold"/>
<LinearLayout
android:layout_below="#+id/badge"
android:id="#+id/right_table"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/score"
android:background="#color/white"
android:orientation="vertical"
android:padding="16dp"
android:showDividers="middle">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView 1"/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="TextView 2"/>
</LinearLayout>
<TextView
android:id="#+id/badge"
android:layout_toRightOf="#id/score"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#0f0"
android:layout_marginLeft="-12dp"
android:layout_marginBottom="-8dp"
android:text="Badge"
/>
</RelativeLayout>
To alternate the background simply set the background in getView in your adapter.
You'll need a custom adapter that fills the ListView (better use RecyclerView & an Adapter with ViehHolder), this row layout is taken from my own project, not exactly what you requested, but you'll get the idea. Just comment for further information.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<TextView
android:id="#+id/textV_player1"
android:text="player1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="40dp"
android:layout_marginEnd="40dp"
android:textSize="20sp"
android:paddingTop="15dp"
android:gravity="end"
android:layout_alignParentTop="true"
android:layout_toLeftOf="#+id/textV_vs"
android:layout_toStartOf="#+id/textV_vs" />
<TextView
android:id="#+id/textV_player2"
android:text="player2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="20sp"
android:paddingTop="15dp"
android:layout_alignBottom="#+id/textV_vs"
android:layout_toRightOf="#+id/textV_vs"
android:layout_toEndOf="#+id/textV_vs" />
<TextView
android:id="#+id/textV_vs"
android:text="vs"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginRight="40dp"
android:layout_marginEnd="40dp"
android:textSize="20sp"
android:layout_above="#+id/textV_points1"
android:layout_centerHorizontal="true" />
<TextView
android:id="#+id/textV_points1"
android:text="1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="20sp"
android:paddingTop="3dp"
android:paddingBottom="15dp"
android:layout_below="#+id/textV_player1"
android:layout_alignRight="#+id/textV_player1"
android:layout_alignEnd="#+id/textV_player1" />
<TextView
android:id="#+id/textV_points2"
android:text="2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="20sp"
android:paddingTop="3dp"
android:paddingBottom="15dp"
android:layout_below="#+id/textV_player2"
android:layout_alignLeft="#+id/textV_player2"
android:layout_alignStart="#+id/textV_player2" />
<TextView
android:id="#+id/textV_vspoints"
android:text=":"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textSize="20sp"
android:paddingBottom="15dp"
android:layout_below="#id/textV_vs"
android:layout_centerHorizontal="true" />
</RelativeLayout>
I have a pretty complex view with many moving parts in a RecyclerView with an adapter that takes care of showing two different view types and "hiding" objects from the list in order to create "collapsing" comments. The code is all working and it displays fine, but it gets extremely laggy on flings downward or upward, and I really can't find a way to simplify my code and/or views. Here is a link to all the code and views
Comment.xml (view)
https://github.com/ccrama/Slide/blob/master/app/src/main/res/layout/comment.xml
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:clipChildren="false"
android:orientation="vertical"
android:scrollbars="none">
<LinearLayout
android:id="#+id/next"
android:layout_width="match_parent"
android:layout_height="2dp"
android:layout_marginBottom="8dp"
android:elevation="8dp"
android:orientation="horizontal" />
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/top"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/card_background"
android:clipChildren="false"
android:orientation="vertical"
android:paddingBottom="0dp"
android:scrollbars="none">
<LinearLayout
android:id="#+id/padd"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:paddingBottom="0dp"
android:scrollbars="none">
<LinearLayout
android:id="#+id/dots"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:background="?attr/activity_background"
android:orientation="horizontal">
</LinearLayout>
<include
android:id="#+id/dot"
layout="#layout/dot" />
<include
android:id="#+id/side"
layout="#layout/dot"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:paddingRight="15dp" />
<LinearLayout
android:id="#+id/background"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:paddingLeft="16dp"
android:paddingRight="16dp"
android:paddingTop="8dp"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
>
<include
android:id="#+id/children"
layout="#layout/commentnumber"
android:layout_width="wrap_content"
android:layout_height="16dp"
android:layout_alignParentRight="true"
android:layout_marginLeft="10dp"
android:gravity="center_horizontal"
android:orientation="horizontal" />
<com.wefika.flowlayout.FlowLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_vertical"
android:gravity="center_vertical"
android:orientation="horizontal"
android:paddingRight="10dp">
<TextView
android:id="#+id/author"
android:layout_width="wrap_content"
android:layout_height="16dp"
android:layout_gravity="center_vertical"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:text="ccrama"
android:textColor="?attr/font"
android:textSize="?attr/font_commenttitle"
android:textStyle="bold"
/>
<TextView
android:id="#+id/score"
android:layout_width="wrap_content"
android:layout_height="16dp"
android:layout_gravity="center_vertical"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:text="+49"
android:textColor="?attr/font"
android:textSize="?attr/font_commentinfo"
android:textStyle="bold" />
<TextView
android:id="#+id/time"
android:layout_width="wrap_content"
android:layout_height="16dp"
android:layout_alignParentRight="true"
android:layout_gravity="center_vertical"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:text="4 hours ago"
android:textColor="?attr/font"
android:textSize="?attr/font_commentinfo" />
<include
android:id="#+id/gild"
layout="#layout/gilded"
android:layout_width="wrap_content"
android:layout_height="16dp"
android:layout_gravity="center_vertical"
android:gravity="center_horizontal"
android:orientation="horizontal"
android:paddingLeft="5dp"
android:paddingRight="5dp" />
<include
android:id="#+id/flairbubble"
layout="#layout/flair"
android:layout_width="wrap_content"
android:layout_height="16dp"
android:layout_gravity="center_vertical"
android:layout_margin="5dp"
android:layout_toRightOf="#+id/pinned"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:src="#drawable/pinned" />
<include
android:id="#+id/you"
layout="#layout/you"
android:layout_width="wrap_content"
android:layout_height="16dp"
android:layout_centerVertical="true"
android:layout_gravity="center_vertical"
android:layout_toRightOf="#+id/pinned"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:src="#drawable/pinned" />
<include
android:id="#+id/op"
layout="#layout/op"
android:layout_width="wrap_content"
android:layout_height="16dp"
android:layout_centerVertical="true"
android:layout_gravity="center_vertical"
android:layout_toRightOf="#+id/pinned"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:src="#drawable/pinned" />
</com.wefika.flowlayout.FlowLayout>
</RelativeLayout>
<me.ccrama.redditslide.ActiveTextView
android:id="#+id/content"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="16dp"
android:textColor="?attr/font"
android:textSize="?attr/font_commentbody" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
<LinearLayout
android:id="#+id/menu"
android:layout_width="match_parent"
android:layout_height="48dp"
android:orientation="horizontal"
android:visibility="gone"
android:weightSum="4">
<ImageView
android:id="#+id/more"
android:layout_width="0dp"
android:layout_height="48dp"
android:layout_weight="1"
android:background="?android:selectableItemBackground"
android:padding="12dp"
android:src="#drawable/more"
android:tint="?attr/tint" />
<ImageView
android:id="#+id/downvote"
android:layout_width="0dp"
android:layout_height="48dp"
android:layout_weight="1"
android:background="?android:selectableItemBackground"
android:padding="12dp"
android:src="#drawable/downvoteicon"
android:tint="?attr/tint" />
<ImageView
android:id="#+id/upvote"
android:layout_width="0dp"
android:layout_height="48dp"
android:layout_weight="1"
android:background="?android:selectableItemBackground"
android:padding="12dp"
android:src="#drawable/upvoteicon"
android:tint="?attr/tint" />
<ImageView
android:id="#+id/reply"
android:layout_width="0dp"
android:layout_height="48dp"
android:layout_weight="1"
android:background="?android:selectableItemBackground"
android:padding="12dp"
android:src="#drawable/reply"
android:tint="?attr/tint" />
</LinearLayout>
<LinearLayout
android:id="#+id/replyArea"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
android:padding="16dp"
android:visibility="gone">
<EditText
android:id="#+id/replyLine"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:backgroundTint="?attr/tint"
android:hint="Reply"
android:imeOptions="actionDone|flagNoEnterAction"
android:inputType="textMultiLine|textAutoCorrect|textCapSentences"
android:minHeight="30dp"
android:textColor="?attr/font"
android:textColorHint="?attr/font" />
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="#+id/discard"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="?android:selectableItemBackground"
android:padding="4dp"
android:text="DISCARD"
android:textColor="?attr/font"
android:textSize="14sp"
android:textStyle="bold" />
<TextView
android:id="#+id/send"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:background="?android:selectableItemBackground"
android:padding="4dp"
android:text="SUBMIT"
android:textColor="?attr/font"
android:textSize="14sp"
android:textStyle="bold" />
</RelativeLayout>
<LinearLayout
android:id="#+id/innersend2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:layout_marginLeft="-6dp"
android:layout_marginRight="-6dp"
android:alpha=".56"
android:gravity="center"
android:orientation="horizontal"
android:weightSum="8">
<ImageButton
android:id="#+id/imagerep"
android:layout_width="0dp"
android:layout_height="48dp"
android:layout_weight="1"
android:height="48dp"
android:background="#00000000"
android:cropToPadding="false"
android:padding="8dp"
android:scaleType="fitCenter"
android:src="#drawable/image"
android:tint="?attr/tint" />
<ImageButton
android:id="#+id/link"
android:layout_width="0dp"
android:layout_height="48dp"
android:layout_weight="1"
android:height="48dp"
android:background="#00000000"
android:cropToPadding="false"
android:padding="8dp"
android:scaleType="fitCenter"
android:src="#drawable/link"
android:tint="?attr/tint" />
<ImageButton
android:id="#+id/bold"
android:layout_width="0dp"
android:layout_height="48dp"
android:layout_weight="1"
android:height="48dp"
android:background="#00000000"
android:cropToPadding="false"
android:padding="8dp"
android:scaleType="fitCenter"
android:src="#drawable/bold"
android:tint="?attr/tint" />
<ImageButton
android:id="#+id/italics"
android:layout_width="0dp"
android:layout_height="48dp"
android:layout_weight="1"
android:height="48dp"
android:background="#00000000"
android:cropToPadding="false"
android:padding="8dp"
android:scaleType="fitCenter"
android:src="#drawable/italics"
android:tint="?attr/tint" />
<ImageButton
android:id="#+id/bulletlist"
android:layout_width="0dp"
android:layout_height="48dp"
android:layout_weight="1"
android:height="48dp"
android:background="#00000000"
android:cropToPadding="false"
android:padding="8dp"
android:scaleType="fitCenter"
android:src="#drawable/bullets"
android:tint="?attr/tint" />
<ImageButton
android:id="#+id/numlist"
android:layout_width="0dp"
android:layout_height="48dp"
android:layout_weight="1"
android:height="48dp"
android:background="#00000000"
android:cropToPadding="false"
android:padding="8dp"
android:scaleType="fitCenter"
android:src="#drawable/numbers"
android:tint="?attr/tint" />
<ImageButton
android:id="#+id/quote"
android:layout_width="0dp"
android:layout_height="48dp"
android:layout_weight="1"
android:height="48dp"
android:background="#00000000"
android:cropToPadding="false"
android:padding="8dp"
android:scaleType="fitCenter"
android:src="#drawable/quotes"
android:tint="?attr/tint" />
<ImageButton
android:id="#+id/size"
android:layout_width="0dp"
android:layout_height="48dp"
android:layout_weight="1"
android:height="48dp"
android:background="#00000000"
android:cropToPadding="false"
android:padding="8dp"
android:scaleType="fitCenter"
android:src="#drawable/fontsizedarker"
android:tint="?attr/tint" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
</LinearLayout>
As you can see, it is a pretty complicated view with 3 main parts. The top "comment" area which is always visible, a menu which visibility is toggled, and a reply area where visibility is rarely used, but can still be toggled.
Here is a link to the adapter
Here is a link to the view the adapter is in (might be helpful!)
I'm hoping that the issue is somewhat simple, but I really can't figure out how to make the code any simpler.
Steps I've taken to fix the lag:
Remove all the code in the comment adapter, still noticeable lag
Remove menu and reply area from the view, improvement but still slow.
Any help/advice is greatly appreciated! Thank you!
EDIT: here's a video of the lag in question https://vid.me/kxrC