Relative layout is hiding the toolbar's title in Android - android

I'm trying to place 3 images on the end of the toolbar of the navigation drawer activity like this.
When using relative layout for aligning, I'm not able to see the "Home" title, I need to align three images to the right of the toolbar like this, and also I need to show the title. Where was I wrong, and how can I achieve it? The first image is what I'm expecting and second image is what I needed.
Here's what I've tried:
<android.support.v7.widget.Toolbar
android:id="#+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="#color/homepage_toolbar_color"
app:popupTheme="#style/AppTheme.PopupOverlay">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<ImageView
android:layout_width="#dimen/_30sdp"
android:layout_height="#dimen/_30sdp"
android:layout_alignParentEnd="true"
android:src="#drawable/kit_icon"
android:layout_marginRight="#dimen/_80sdp"/>
<ImageView
android:layout_width="#dimen/_30sdp"
android:layout_height="#dimen/_30sdp"
android:layout_alignParentEnd="true"
android:layout_marginRight="#dimen/_40sdp"
android:src="#drawable/price_toolbar_icon"/>
<ImageView
android:layout_width="#dimen/_30sdp"
android:layout_height="#dimen/_30sdp"
android:layout_alignParentEnd="true"
android:src="#drawable/chat_toolbar_icon"
android:layout_marginTop="#dimen/_2sdp"/>
</RelativeLayout>
</android.support.v7.widget.Toolbar>

Try adding a TextVieW near the images with the title. It should show all this way. You place this in the relative layout before the first imageview:
<TextView android:id="#+id/Txv_home"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="8dp"
android:text="Home" />

Related

Button on bottom of image with parameter adjustViewBounds Android studio

I need a button on bottom of an image with the parameter android:adjustViewBounds="true".
This is what I'm looking for:
But this is what I'm getting:
This is the code I'm using:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/idImg"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:adjustViewBounds="true" //i really need this parameter because the height of each image is different
android:src="#drawable/homero" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:text="See more"/>
</RelativeLayout>
If you want your ImageView and Button to be overlapping, they either need to reference each other, or have the same layout alignment.
In this example, aligning your Button to the bottom of your ImageView will resolve this.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:id="#+id/idImg"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:src="#drawable/homero" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#id/idImg"
android:text="See more"/>
</RelativeLayout>
The way you currently have it, your button is trying to get to the bottom of your RelativeLayout. Because your RelativeLayout has a height of wrap_content, it just keeps growing as the button tries to get to the bottom, eventually filling the screen!

put frame layout below relative layout

i'm trying to fix this issue but 'im stuck.
The problem:
I want to put frame layout below relative layout.
FrameLayout = Emoticons
Relative layout = container with edittext
i wish when i click in smile button, the framelayout show up above edittext.
but i cant do it..everthing works fine, except this.
Picture :
Error :
i'm using this code
<!--Container FrameLayout-->
<FrameLayout
android:id="#+id/keyboard_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"/>
<!--Container Emoticon Edittext-->
<RelativeLayout
android:id="#+id/bottom_container"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_marginBottom="#dimen/edt_msg_content_margin"
android:layout_marginLeft="#dimen/edt_msg_content_margin"
android:layout_marginStart="#dimen/edt_msg_content_margin"
android:layout_toLeftOf="#+id/btn_send_message"
android:layout_toStartOf="#+id/btn_send_message"
android:background="#drawable/message_item_background"
android:layout_above="#id/keyboard_container"
android:elevation="4dp"
android:paddingBottom="#dimen/edt_msg_content_padding_v"
android:paddingLeft="#dimen/edt_msg_content_padding_h"
android:paddingRight="#dimen/edt_msg_content_padding_h"
android:paddingTop="#dimen/edt_msg_content_padding_v">
<ImageView
android:id="#+id/botao_emoji"
android:layout_width="#dimen/edt_ic_size"
android:layout_height="#dimen/edt_ic_size"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
android:layout_centerVertical="true"
android:background="?attr/selectableItemBackgroundBorderless"
android:padding="4dp"
app:srcCompat="#drawable/chat_emoticon"
android:tint="#color/green_600"/>
<!--<hani.momanii.supernova_emoji_library.Helper.EmojiconEditText-->
<com.kevalpatel2106.emoticongifkeyboard.widget.EmoticonEditText
android:id="#+id/edt_message_content"
style="#style/Base.TextAppearance.AppCompat.Medium"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_toLeftOf="#+id/iv_camera"
android:layout_toStartOf="#+id/iv_camera"
android:background="#00ffffff"
android:hint="Digite sua mensagem!"
android:inputType="textMultiLine|textCapSentences|textNoSuggestions"
android:lines="2"
android:maxLines="3"
android:layout_toRightOf="#+id/botao_emoji"
android:layout_toEndOf="#+id/botao_emoji"/>
<ImageButton
android:id="#+id/message_love_button"
android:layout_width="#dimen/edt_ic_size"
android:layout_height="#dimen/edt_ic_size"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_centerVertical="true"
android:background="?attr/selectableItemBackgroundBorderless"
android:padding="4dp"
app:srcCompat="#drawable/ic_love_animation"
android:tint="#color/red_400"/>
</RelativeLayout>
thanks!
Remove
android:layout_alignParentBottom="true"
From the relative layout..

I want to align the icons accordingly in my android app in the top bar

I want to align the icons accordingly in my android app in the top bar my top bar has side menu on the left image
It has some empty space after the side menu icon I want to fill that space by arranging the icons accordingly but I don't know how to do that
please help me to avoid that empty space and put the icon in that place
I have also attached image for better view
Thanks
please try to create a custom layout for action bar & inflate it.
You can use setlogo method in toolbar to fill the your desired space
toolbar.setLogo(R.drawable.yourlogo);
or simply set all icon inside your toolbar according to your requirement.
like this
<android.support.v7.widget.Toolbar
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize">
<LinearLayout
android:layout_width="wrap_content"
android:orientation="horizontal"
android:layout_height="wrap_content">
<ImageView
android:layout_width="wrap_content"
android:background="#mipmap/ic_launcher"
android:layout_height="wrap_content" />
<ImageView
android:layout_width="wrap_content"
android:background="#mipmap/ic_launcher"
android:layout_height="wrap_content" />
<ImageView
android:layout_width="wrap_content"
android:background="#mipmap/ic_launcher"
android:layout_height="wrap_content" />
<ImageView
android:layout_width="wrap_content"
android:background="#mipmap/ic_launcher"
android:layout_height="wrap_content" />
<ImageView
android:layout_width="wrap_content"
android:background="#mipmap/ic_launcher"
android:layout_height="wrap_content" />
</LinearLayout>
</android.support.v7.widget.Toolbar>
Hope this help!

ImageView overlay not working

I have 2 layouts in my xml, a CircularImageView and a ImageView, and the ImageView must appear on top of the CircularImageView.
I've tried:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/fragment_kids_register_ll_kid"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/md_white_1000"
android:orientation="horizontal">
<RelativeLayout
android:padding="16dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<com.mikhaellopez.circularimageview.CircularImageView
android:id="#+id/fragment_kids_row_img_kids"
android:layout_width="70dp"
android:layout_height="70dp"
android:src="#drawable/ic_boy"
/>
<ImageView
android:id="#+id/fragment_kids_row_iv_crown"
android:layout_toRightOf="#+id/fragment_kids_row_img_kids"
android:layout_marginLeft="-26dp"
android:layout_marginTop="-22dp"
android:layout_width="48dp"
android:layout_height="48dp"
android:src="#drawable/ic_crown"/>
</RelativeLayout>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:id="#+id/fragment_kids_row_tv_name"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="20dp"
android:textColor="#color/md_black_1000"
android:textSize="24sp" />
<TextView
android:id="#+id/fragment_kids_row_tv_age"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:text="1 ano e 4 meses"
android:textColor="#808080"
android:textSize="12sp" />
</LinearLayout>
</LinearLayout>
And it is getting cut off:
I need the image to be shown exactly at that position in the picture, but not "cropped", what I am missing here ?
BTW, this component is part of a RecyclerView row.
EDIT ---
I forgot to mention, the image is just a placeholder to show the Avatar, but the image is dinamically populated !
Thanks !
The padding (16dp) that you are applying to the first relativeLayout makes you think that there is more place and that you can move up the imageView. Actually the margin is like a gap, it doesn't extend your layout.
This is the solution I suggest , using a FrameLayout
<FrameLayout
android:layout_width="100dp"
android:layout_height="100dp">
<com.mikhaellopez.circularimageview.CircularImageView
android:id="#+id/fragment_kids_row_img_kids"
android:layout_gravity = "center"
android:layout_width="70dp"
android:layout_height="70dp"
android:src="#drawable/ic_boy"
/>
<ImageView
android:id="#+id/fragment_kids_row_iv_crown"
android:layout_width="48dp"
android:layout_height="48dp"
android:src="#drawable/ic_crown"
android:layout_gravity="right|top" />
</FrameLayout>
EDIT : You don't have to use a frameLayout, you can use a relativeLayout if you want to set different margins. The point here is really to make your containing layout bigger so you can place the imageview easily.
If you want one image to be on top of another, why you use android:layout_toRightOf?
Remove it and second image should cover first one.
Also you can try to remove margins at second image and use centerInParent, centerVertically or centerHorizontally.
Or maybe I didn't got all the problem ) then pls provide more details. Thanks.
Have you tried Using an image editor like Paint/Photoshop and merging the two images? Then you can just display one image in your view.
try using a linear layout with the orientation set to vertical.

Make view fixed to top when it passes the top

Sorry if the title isn't really clear but I don't know what the effect is called. It will get clear with some screenshots..
I have a homescreen with a search container on the top and a list of houses at the bottom.
The whole homescreen is a scrollview and when the 'Panden in uw buurt' textview passes the top off the screen I want it to be fixed.
start screen:
what I want to achieve if user scrolls down:
This is my xml layout:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
<include
android:id="#+id/quick_search_view"
layout="#layout/view_quick_search"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_below="#+id/quick_search_view"
android:orientation="vertical">
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:adjustViewBounds="true"
android:scaleType="centerCrop"
android:src="#drawable/house1" />
<ImageView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="10dp"
android:adjustViewBounds="true"
android:scaleType="centerCrop"
android:src="#drawable/house2" />
</LinearLayout>
<View
android:layout_width="45dp"
android:layout_height="45dp"
android:layout_below="#+id/quick_search_view"
android:layout_marginLeft="7dp"
android:background="#drawable/triangle_indicator"
android:rotation="180" />
</RelativeLayout>
follow the steps-
Exclude 'Panden in uw buurt' from your "#layout/view_quick_search".[Header also if its not actionBar]
Put it below "#+id/quick_search_view".
set/add Listeners for Scrolling.
OnScroll set visibility of "#+id/quick_search_view" gone/visible OR set
translate animation.
I found the solution : here
The stickyfragment and observableScrollView did the job!

Categories

Resources