How to get this message bubble to be on the right side? - java

I have this as my layout for an item in my listview:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#drawable/msgbox_self_default" >
<RelativeLayout
android:id="#+id/layout"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:paddingLeft="7dip" >
<ImageView android:id="#+id/pending" android:layout_height="fill_parent"
android:layout_width="wrap_content" android:layout_marginLeft="2dip"
android:src="#drawable/ic_sms_mms_pending"
android:visibility="gone"
/>
<TextView
android:id="#+id/body"
android:text="#+id/body"
android:singleLine="false"
android:paddingLeft="#dimen/message_item_text_padding_left_right"
android:paddingRight="#dimen/message_item_text_padding_left_right"
android:paddingTop="#dimen/message_item_text_padding_top"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:linksClickable="false"
android:textAppearance="?android:attr/textAppearanceSmall"
android:textColor="#ff000000"
android:textSize="16sp"
android:layout_alignParentRight="true" />
<RelativeLayout
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_below="#id/body"
android:id="#+id/picture_layout"
android:orientation="vertical"
>
<ImageView android:layout_width="wrap_content"
android:layout_height="wrap_content" android:id="#+id/picture"
android:visibility="gone"
android:maxWidth="178dip" android:maxHeight="178dip"
android:layout_alignParentRight="true"
android:adjustViewBounds="true" android:background="#android:drawable/picture_frame"
android:layout_centerHorizontal="true"/>
</RelativeLayout>
<TextView
android:paddingRight="#dimen/message_item_text_padding_left_right"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/picture_layout"
android:paddingLeft="3dip"
android:textAppearance="?android:attr/textAppearanceSmall"
android:id="#+id/date"
android:text="#+id/date"
android:singleLine="true"
android:layout_alignParentRight="true" />
</RelativeLayout>
I want the bubble though to be on the right side. This is a layout for a message bubble. I am trying to put it on the right side like the iPhone conversations. I have tried every possibly thing I can think of relating to putting it on the right side instead of the left. Does anyone see anything wrong with my layout? Please help! Thanks
** EDIT **
The green bubble is the one that I aiming for in this picture
http://getandroidstuff.com/wp-content/uploads/2010/12/GO-SMS-Android.jpg
* CHANGED LAYOUT *
this is so far what I have.. anymore ideas?
I want the grey bubble to look like the white one except on the right side.

Im not going to sift through your code but basically you just want something like this for each message
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:padding="put the right amount of padding in">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="make this your background, make sure to add padding in so that the text view is in the right place, look at 9 patches"
android:layout_alignParentRight="true"/><!-- Or make this left -->
</RelativeLayout>
Don't over complicate things, just use a text view with a 9 patch and it will do what you want.
Just swap the 9 patch horizontally and it'll be around the other way

Related

How to use directional arrows in TextView

What's the correct way to use directional arrows within a TextView without having to create a drawable? Unicode has been thought of but it's not clear which character codes need be used. What code must be used both for HTML and programmatically for the left, right, up & down arrows? Ideally to get the same result as the arrows used in the screenshots below (notice how they are correctly autosized and positioned in line as the text).
You are right you can use Unicode like below
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/container"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_gravity="center"
android:orientation="vertical">
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/textView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="→ right" />
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/textView2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="← left" />
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/textView3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="↑ top" />
<androidx.appcompat.widget.AppCompatTextView
android:id="#+id/textView4"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:text="↓ bottom" />
</LinearLayout>
I use this site it has a lot of data for arrows section check here

Aligning Content in an Android ListView

I apologize for this question may have been asked somewhere, but I'm not sure how to phrase it.
I have a ListView in my Android app and I want to align the content in each row so that each TextView is aligned with corresponding TextViews in rows below it (left, right, and center).
This picture is what I'm going for listview:
So, the left TextView is aligned all the way to the left and the right TextView is aligned all the way to the right. The center TextView is aligned such that it always "begins" at the same place (ie. it's position is not affected by the length of the left TextView).
How can I achieve this? Thanks a lot
use bellow like.. I have used first textview left, second center & third is right. You can change as your wish...
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="3">
<TextView
android:id="#+id/tv_textview"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="left|center_vertical|center_horizontal"
android:text="AAP 500" />
<TextView
android:id="#+id/tv_textview2"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="center|center_vertical|center_horizontal"
android:text="85.65" />
<TextView
android:id="#+id/tv_textview3"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="right|center_vertical|center_horizontal"
android:text="-3.75(-3.34 %)" />
</LinearLayout>
You'll want to use a LinearLayout with horizontal orientation then apply a weight to each of the textviews inside of it. this will cause them to each take a certain fraction of the layout. You can start by giving them each a weight of 1 and adjusting from there. The right-most textview will also need a right justification on the text to match the picture.
You have to create custom listView in that your item_row_view.xml will look like this
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
<TextView
android:id="#+id/tv_textview"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_weight="1"
android:text="AAP 500"
android:textAlignment="center" />
<TextView
android:id="#+id/tv_textview2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:text="85.65"
android:textAlignment="center" />
<TextView
android:id="#+id/tv_textview3"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:text="-3.75(-3.34 %)"
android:textAlignment="center" />
</RelativeLayout>

How to fill RecyclerView (StaggeredGridLayoutManager) with images in correct scale type?

I got such issue with my RecyclerView
I need to present to user images that I downloaded with help of picasso lib from web to my RecyclerView. Eventually it looks like this
As you can see I need to scratch my images, but in proper aspect ratio of course.
I went to my XML file and set attribute in my ImageView android:scaleType="fitXY"
now my ImageView looks like this
<ImageView
android:id="#+id/imageViewMainCard"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scaleType="fitXY"
/>
and here is result that I got
as you can see now image fill all available space, but them doesn't scratch with propriety aspect ratio. Images scratch width more than height and does't looks nice...
Also here is my XML file
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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="wrap_content"
android:paddingBottom="3dp"
android:paddingEnd="3dp"
android:paddingStart="3dp"
android:paddingTop="3dp"
>
<LinearLayout
android:id="#+id/cardMainActivityLinearLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
>
<com.balysv.materialripple.MaterialRippleLayout
android:id="#+id/rippleInbox"
android:layout_width="match_parent"
android:layout_height="wrap_content"
app:mrl_rippleColor="#color/ntz_background_light_grey"
app:mrl_rippleOverlay="true"
>
<ImageView
android:id="#+id/imageViewMainCard"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:scaleType="fitXY"
/>
</com.balysv.materialripple.MaterialRippleLayout>
<RelativeLayout
android:id="#+id/rlCardMain"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#color/white"
android:padding="4dp"
>
<TextView
android:id="#+id/tvBrandName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentStart="true"
android:layout_alignParentTop="true"
android:textColor="#color/black_color"
android:textSize="10dp"
/>
<TextView
android:id="#+id/tvItemName"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/tvBrandName"
android:textColor="#color/black_color"
android:textSize="10dp"
/>
<TextView
android:id="#+id/tvPreviousPrice"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/tvItemName"
android:textColor="#color/black_color"
android:textSize="10dp"
/>
<TextView
android:id="#+id/tvDivider"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/tvPreviousPrice"
android:layout_toEndOf="#+id/tvPreviousPrice"
android:text=" / "
android:textSize="10dp"
android:visibility="gone"
/>
<TextView
android:id="#+id/tvPrice"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/tvDivider"
android:layout_toEndOf="#+id/tvDivider"
android:textColor="#color/black_color"
android:textSize="10dp"
/>
<Button
android:id="#+id/bAction"
android:layout_width="70dp"
android:layout_height="30dp"
android:layout_alignParentEnd="true"
android:layout_alignParentTop="true"
android:textSize="8dp"
/>
</RelativeLayout>
</LinearLayout>
</LinearLayout>
What am I doing wrong?
Edit1
There is a result of android:scaleType="centerCrop" attributes
It is also not so nice when women don't have head))
Edit2
There is result of android:scaleType="centerInside"
To answer your question, please use centerCrop to center the image absolute to it's parent. Also add this attribute, android:adjustViewBounds="true". With this the aspect ratio of the image will be preserved.
fitXY uses FILL which is described as "Scale in X and Y independently, so that src matches dst exactly. This may change the aspect ratio of the src" in the Android Documentation.
You should use centerInside to center, fit and scale while keeping the aspect ratio
Alright the problem is that your layout does not respect the bounds of your image.To remedy this, wrap the image-view in a separate parent layout , add a parent weight to the layout it self with layout_weight="1".Then set the width relative to the layout with android:layout_width="0px", to avoid tearing and proper bounds coordination set android:adjustViewBounds="true". To center and crop the image at it's center use android:scaleType="centerCrop".

Weight in scrollview

I have a task - make an activity like this Here photo takes one half of screen and text takes another. And everything works fine with weights, but sometimes text can take a lot of space and don't fit in screen, so I covered all my layout with ScrollView, but here comes problem. If everything doesn't fit into one screen everything should look that way - photo will take one half of visible screen and second half will contain some part of text that can fit there, and when I scroll, everything should be scrolled and new text will appear at the bottom. But I don't understand how to realize that, weights here work in some weird way and as I understood tag fillViewPort="true" makes something only if there is nothing to scroll, and when there is something this tag makes nothing. So how can I make my view look in proper way?
Here is my XML
<?xml version="1.0" encoding="utf-8"?>
<ScrollView 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:fillViewport="true">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
tools:context="leopikinc.musiciansyandex.MusicianInfo"
android:orientation="vertical">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<ImageView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/big_photo"
android:src="#drawable/test"
android:layout_gravity="center" />
</LinearLayout>
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Genres"
android:id="#+id/genres"
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Album count"
android:id="#+id/album_count"
android:layout_below="#+id/genres"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Track count"
android:id="#+id/track_count"
android:layout_above="#+id/biography_string"
android:layout_toRightOf="#+id/album_count"
android:layout_toEndOf="#+id/album_count" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceLarge"
android:text="#string/biography_string_text"
android:id="#+id/biography_string"
android:layout_below="#+id/album_count"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:textAppearance="?android:attr/textAppearanceMedium"
android:text="Biography Text"
android:id="#+id/biography_text"
android:layout_below="#+id/biography_string"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true" />
</RelativeLayout>
</LinearLayout>
</ScrollView>
I achived my aim making it programmaticaly. In activity I got access to ImageView and set it's height = half of visible screen.
ViewGroup.LayoutParams lp = bigphoto.getLayoutParams();
lp.height = getResources().getDisplayMetrics().heightPixels/2;
bigphoto.setLayoutParams(lp);
But still I don't know how to make this using XML

creating buttons for dashboard, problems with onClick, maybe better solution?

I am currently implementing my dashboard. My current solution for buttons is this:
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="33"
android:gravity="center_horizontal"
android:orientation="vertical"
android:background="#drawable/button_frame"
android:id="#+id/viewAddItemBtn"
android:onClick="BtnListener"
>
<ImageButton
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:background="#drawable/addbutton"
/>
<TextView
android:text="Add Item"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="5dp"
/>
</LinearLayout>
However, I now have some problems with 1. the "clickability" and the states (focused/pressed/normal).
As you might guess out of my code: If i click on the "ImageButton" (which could basically be a imageview too on solution) it does nothing. (because onClick is not assigned, I thought it would inherit the attribute from its overall LinearLayout). Second thing is, if I make the "ImageButton" Clickable too, i guess the states won't be called, am I right here?
is there any better solutions for my design?
little demo-picture on how the button should look like: http://i.imgur.com/aI2Vb.png
Why do not you add the onClick property for all of the components:
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:layout_weight="33"
android:gravity="center_horizontal"
android:orientation="vertical"
android:background="#drawable/button_frame"
android:id="#+id/viewAddItemBtn"
android:onClick="BtnListener"
>
<ImageButton
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:background="#drawable/addbutton"
android:onClick="BtnListener"
/>
<TextView
android:text="Add Item"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_gravity="center"
android:layout_marginTop="5dp"
android:onClick="BtnListener"
/>
</LinearLayout>

Categories

Resources