universal image loader not working for Relative layout in ArrayAdapter - android

i have list of image path's in json response. i prompt to set the images as background of relative layout from the path. so on this i have been advised and used to ArrayAdapter and universal image loader to achieve this.i hope myself 95% i have done this. but the problem is its loaded only one image in my ui which is from two images where i have in json response.
here i tried in ArrayAdapter class inside getView() method
RelativeLayout layContentOfListView;
// Initialize the Relative layout container
layContentOfListView = (RelativeLayout)rowView.findViewById(R.id.layContentOfListView);
// Load image, decode it to Bitmap and return Bitmap to callback
ImageSize targetSize = new ImageSize(150, 100); // result Bitmap will be fit to this size
imageLoader.loadImage(fullImagePath, targetSize, new SimpleImageLoadingListener() {
#Override
public void onLoadingComplete(String imageUri, View view, Bitmap loadedImage) {
if (loadedImage != null) {
Drawable d = new BitmapDrawable(context.getResources(), loadedImage);
layContentOfListView.setBackgroundDrawable(d);
}
}
});
this is my relative layout content in the list view of each row.
<?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="wrap_content"
android:id="#+id/layContentOfListView"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:paddingBottom="10dp"
android:orientation="vertical"
android:background="#drawable/gray_boardered_transparent_shape"
>
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#color/color_red"
android:paddingTop="5dp"
android:paddingBottom="5dp"
android:paddingLeft="10dp"
android:paddingRight="10dp"
android:id="#+id/layHeader"
android:layout_marginBottom="10dp"
android:orientation="vertical">
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/lblMerchantName"
android:layout_weight="1"
android:text="Merchant Name"
android:textAlignment="textStart"
android:textSize="15sp"
android:textColor="#color/color_white"
/>
</LinearLayout>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="40dp"
android:id="#+id/lblRewardPoints"
android:text="Reward points"
android:textSize="15sp"
android:textColor="#color/color_white"
android:gravity="center"
android:layout_centerHorizontal="true"
/>
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginBottom="20dp"
android:id="#+id/lblRewardName"
android:text="Reward Name"
android:textSize="15sp"
android:textColor="#color/color_white"
android:layout_below="#+id/lblRewardPoints"
android:layout_centerHorizontal="true"
/>
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:id="#+id/imgMemStar"
android:src="#drawable/icon_mem_star"
android:layout_below="#+id/lblRewardName"/>
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_marginRight="40dp"
android:id="#+id/imgMemHand"
android:src="#drawable/icon_mem_like"
android:layout_below="#+id/lblRewardName"
android:layout_toLeftOf="#+id/imgMemPhone"
/>
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:id="#+id/imgMemPhone"
android:src="#drawable/icon_mem_phone"
android:layout_below="#+id/lblRewardName"
android:layout_centerHorizontal="true"/>
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:layout_marginLeft="40dp"
android:id="#+id/imgMemQRCode"
android:src="#drawable/icon_mem_qr"
android:layout_below="#+id/lblRewardName"
android:layout_toRightOf="#+id/imgMemPhone"
/>
<ImageView
android:layout_width="30dp"
android:layout_height="30dp"
android:id="#+id/imgMemLocation"
android:src="#drawable/icon_mem_location"
android:layout_below="#+id/lblRewardName"
android:layout_alignParentRight="true"/>
</RelativeLayout>
and this is my output screen
i can't found the solution as too long. can anyone please charity on this.Thanks.!

I have tested this and it is working fine.
import android.graphics.Bitmap;
import android.graphics.drawable.BitmapDrawable;
import android.graphics.drawable.Drawable;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.util.Log;
import android.widget.RelativeLayout;
import com.squareup.picasso.Picasso;
import com.squareup.picasso.Target;
public class MainActivity extends AppCompatActivity {
RelativeLayout relativeLayout;
String url = "Image_URL";
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
relativeLayout = (RelativeLayout) findViewById(R.id.lay);
Picasso.with(this)
.load(url)
.into(new Target() {
#Override
public void onBitmapLoaded (final Bitmap bitmap, Picasso.LoadedFrom from){
/* Save the bitmap or do something with it here */
//Set it in the ImageView
Drawable dr = new BitmapDrawable(bitmap);
relativeLayout.setBackground(dr);
}
#Override
public void onPrepareLoad(Drawable placeHolderDrawable) {
}
#Override
public void onBitmapFailed(Drawable errorDrawable) {
}
});
}
}
Use this in manifest before Application.
<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE" />
<uses-permission android:name="android.permission.INTERNET" />
Add the following line in dependencies or Gradle.
compile 'com.squareup.picasso:picasso:2.5.2'

You should use the picasso library, it is the best.
Add the following line in dependencies or Gradle.
compile 'com.squareup.picasso:picasso:2.5.2'
And use the following code to load the image in ImageView.
Picasso.with(this)
.load(pictureURL)
.into(ImageView);
So Simple. For more details check these links. 1, 2

I think it will load on an image view create a fakeimageview and supply it to the uil and then inloading complete you have the bitmap set it on your relative layout

Related

How Whatsapp attachment's window can override keyboard?

I'm working on a similiar problem developing my chat and I was checking on how whatsapp solves it to get an idea to work on it.
On mobile and inside a conversation, when your keyboard is up on the screen and you click on attachments, the attachments window overrides the keboard like the image below. It also look likes the activity under it freezes ( you can look at the slash "|" on the EditText, it seems that is freeze ).
I was wondering how WP could override the keyboard and why it looks like the activity under it is freezing, thanks in advance!
/Use the below code Snipet without using any library/
action_attach.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
openDialog();
}
});
private void openDialog() {
LayoutInflater layoutInflater = (LayoutInflater) getSystemService(Context.LAYOUT_INFLATER_SERVICE);
// inflate the custom popup layout
final View inflatedView;
inflatedView = layoutInflater.inflate(R.layout.custom_dialog_options_menu, null, false);
LinearLayout layoutGallery;
layoutGallery = (LinearLayout) inflatedView.findViewById(R.id.layoutGallery);
layoutGallery.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View view) {
FloatingView.dismissWindow();
}
});
FloatingView.onShowPopup(this, inflatedView);
}
/**Sample Layout for Pop Up window ie: custom_dialog_options_menu
and change layout according to your choice***/
<?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="wrap_content"
android:orientation="vertical"
android:paddingTop="82dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#FFF"
android:orientation="horizontal">
<LinearLayout
android:id="#+id/layoutGallery"
android:layout_width="0dp"
android:layout_marginTop="18dp"
android:layout_height="wrap_content"
android:layout_marginLeft="40dp"
android:layout_weight="1"
android:orientation="vertical">
<ImageView
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_gravity="center"
android:src="#drawable/gallery_attach_icon_selector"/>
<TextView
android:id="#+id/tvGallery"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:text="Gallery"
android:layout_marginTop="10dp"
android:textSize="16sp"
android:textColor="#4d4747"/>
</LinearLayout>
<LinearLayout
android:id="#+id/layoutPhoto"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_marginTop="18dp"
android:orientation="vertical">
<ImageView
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_gravity="center"
android:src="#drawable/camera_attach_icon_selector"/>
<TextView
android:id="#+id/tvPhoto"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:text="Camera"
android:layout_marginTop="10dp"
android:textSize="16sp"
android:textColor="#4d4747"/>
</LinearLayout>
<LinearLayout
android:id="#+id/layoutVideo"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginRight="40dp"
android:layout_weight="1"
android:layout_marginTop="18dp"
android:orientation="vertical">
<ImageView
android:layout_width="60dp"
android:layout_height="60dp"
android:layout_gravity="center"
android:src="#drawable/video_attach_icon_selector"/>
<TextView
android:id="#+id/tvVideo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center_horizontal"
android:text="Video"
android:layout_marginTop="10dp"
android:textSize="16sp"
android:textColor="#4d4747"/>
</LinearLayout>
</LinearLayout>
</LinearLayout>
/**FloatingView Class**/
public class FloatingView
{
/* Floating view is used to display a custom view for attachments in the chat screen */
import android.app.Activity;
import android.graphics.Point;
import android.view.Display;
import android.view.Gravity;
import android.view.View;
import android.view.ViewGroup;
import android.view.WindowManager;
import android.widget.PopupWindow;
private static PopupWindow popWindow;
private FloatingView() {
}
public static void onShowPopup(Activity activity, View inflatedView) {
// get device size
Display display = activity.getWindowManager().getDefaultDisplay();
final Point size = new Point();
display.getSize(size);
// fill the data to the list items
// set height depends on the device size
popWindow = new PopupWindow(inflatedView, size.x, ViewGroup.LayoutParams.WRAP_CONTENT,
true);
// set a background drawable with rounders corners
popWindow.setBackgroundDrawable(activity.getResources().getDrawable(
R.drawable.comment_popup_bg));
// make it focusable to show the keyboard to enter in `EditText`
popWindow.setFocusable(true);
// make it outside touchable to dismiss the popup window
popWindow.setOutsideTouchable(true);
popWindow.setSoftInputMode(WindowManager.LayoutParams.SOFT_INPUT_ADJUST_PAN);
// show the popup at bottom of the screen and set some margin at
// bottom ie,
popWindow.showAtLocation(activity.getCurrentFocus(), Gravity.BOTTOM, 0,
0);
}
public static void dismissWindow() {
popWindow.dismiss();
}

How to translate image across the width of relativelayout in android

I'm trying to animate two images one from left to right and other from right to left all at the same time. For this I have set the left margin for left image equal to negative of its width and same for right image so that they are out of the view.
Now in my mainactivity I'm translating them using translationX but nothing is happening.
Here is xml file
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/rLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/bg"
tools:context="com.example.BeX.MainActivity" >
<ImageView
android:id="#+id/imageView1"
android:layout_width="200dp"
android:layout_height="133dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:src="#drawable/logo" />
<ImageView
android:id="#+id/left"
android:layout_width="100dp"
android:layout_height="75dp"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_marginLeft="-100dp"
android:src="#drawable/left" />
<ImageView
android:id="#+id/right"
android:layout_width="114dp"
android:layout_height="75dp"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
android:layout_marginRight="-114dp"
android:src="#drawable/right" />
</RelativeLayout>
Here is mainactivity.java
import android.app.Activity;
import android.os.Bundle;
import android.widget.ImageView;
import android.widget.RelativeLayout;
public class MainActivity extends Activity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setTheme(R.style.AppBaseTheme1);
setContentView(R.layout.activity_main);
RelativeLayout r = (RelativeLayout)findViewById(R.id.rLayout);
ImageView left = (ImageView)findViewById(R.id.left);
ImageView right = (ImageView)findViewById(R.id.right);
left.animate().translationX(r.getWidth()).setDuration(2000);
right.animate().translationX(-r.getWidth()).setDuration(2000);
}
}
Please tell me what is the correct or possible way to do that
Thanks in advance
There are two base types of Animation in Android.
The first one.
In order to animate translation use this example:
TranslateAnimation r = new TranslateAnimation(0,0,0,200);
r.setDuration(2000L);
r.setRepeatCount(0);
r.setFillAfter(true);
view.startAnimation(r);
The second one.
In your case, you use ViewPropertyAnimator class.
This is the second implementation of animation in Android.
left.animate().translationX(r.getWidth()).setDuration(2000)
In your case you have setup the Object animator but you haven't started it.
try this:
left.animate().translationX(r.getWidth()).setDuration(2000).start() :)
EDIT
This have to work:
XML:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/rLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#null">
<ImageView
android:id="#+id/imageView1"
android:layout_width="200dp"
android:layout_height="133dp"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:src="#drawable/aqu" />
<ImageView
android:id="#+id/left"
android:layout_width="100dp"
android:layout_height="75dp"
android:src="#drawable/ar" />
<ImageView
android:id="#+id/right"
android:layout_width="114dp"
android:layout_height="75dp"
android:src="#drawable/ari" />
</RelativeLayout>
Java-file
#Override
protected void onCreate(Bundle savedInstanceState) {
// TODO Auto-generated method stub
super.onCreate(savedInstanceState);
setContentView(R.layout.dat);
RelativeLayout r = (RelativeLayout)findViewById(R.id.rLayout);
ImageView left = (ImageView)findViewById(R.id.left);
ImageView right = (ImageView)findViewById(R.id.right);
float distance = 300.f;
TranslateAnimation anim = new TranslateAnimation(0,0,0,distance);
anim.setFillAfter(true);
anim.setDuration(12000L);
left.startAnimation(anim);
}
But anyway if you want to animate using your ide write this:
ObjectAnimator anim0 = ObjectAnimator.ofFloat(right, "translationX", 0,300);
anim0.setDuration(10000L);
anim0.start();
It really works. I've tested.

Show Button over a bitmap not imageview

I have a full screen activity that is used to show the advertisement. Advertisement is just a image and there is a cross button over the image. Everything seems to work fine the only issue I am facing is when the image coming from server is in landscape mode then cross button remains at top and image at center
When image is in portrait mode then image comes in full screen and cross at the top
Can anyone suggest me how to move cross button over the image loaded like in second image for landscape images.
Here is my code
img = (ImageView) findViewById(R.id.adimage);
try {
obj = new JSONObject(store.getString(Constants.PROFILE_STRING));
JSONObject advert = obj.getJSONObject("advertisement");
url = advert.getString("url");
image = advert.getString("image");
name = advert.getString("name");
DisplayImageOptions options = new DisplayImageOptions.Builder()
.imageScaleType(ImageScaleType.EXACTLY)
.cacheOnDisc(true)
.build();
il.loadImage(image, options, new ImageLoadingListener() {
#Override
public void onLoadingStarted(String imageUri, View view) {
}
#Override
public void onLoadingFailed(String imageUri, View view, FailReason failReason) {
}
#Override
public void onLoadingCancelled(String imageUri, View view) {
}
#Override
public void onLoadingComplete(String imageUri, View view, Bitmap loadedImage) {
img.setImageBitmap(loadedImage);
findViewById(R.id.close).setVisibility(View.VISIBLE);
}
});
} catch (JSONException e) {
e.printStackTrace();
}
Here is my layout file
<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="match_parent"
android:fitsSystemWindows="true"
android:padding="10dp"
tools:context="soulvant.golfclub.Advertisement">
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true">
<!--<ImageView
android:id="#+id/backgroundImage"
android:layout_width="match_parent"
android:layout_height="match_parent"
/>-->
<ImageView
android:id="#+id/adimage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true" />
<ImageView
android:id="#+id/close"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_alignParentTop="true"
android:layout_alignRight="#+id/adimage"
android:layout_alignTop="#+id/adimage"
android:layout_gravity="right|top"
android:padding="5dp"
android:scaleType="centerCrop"
android:src="#drawable/a_close_button"
android:visibility="gone" />
</FrameLayout>
Well, you can do it this way.
Get the width and height of the adImage when it's downloaded
Then, place the close button/image on the adImage, specifying the location where you want to place the image
Try by keep android:adjustViewBounds="true" in your imageview this property adjust image bounds to preserve the aspect ratio of its drawable.do like:
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true" >
<ImageView
android:id="#+id/adimage"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:adjustViewBounds="true" />
<ImageView
android:id="#+id/close"
android:layout_width="40dp"
android:layout_height="40dp"
android:layout_gravity="right|top"
android:padding="5dp"
android:scaleType="centerCrop"
android:src="#drawable/ic_launcher"
android:visibility="gone" />
</FrameLayout>

Text over image with matching relative positioning on different screen sizes

I'm stuck.
The problem is how to place text on a static image and keep position depends on it between different screen dimensions.
To achieve this I've tried the layout above:
<?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:padding="#dimen/default_view_padding">
<ImageView
android:id="#+id/iv_background"
android:layout_width="500dp"
android:adjustViewBounds="true"
android:layout_height="900dp"
android:layout_centerInParent="true"
android:src="#drawable/example"/>
<TextView
android:layout_alignLeft="#id/iv_background"
android:layout_alignStart="#id/iv_background"
android:layout_alignEnd="#id/iv_background"
android:layout_alignRight="#id/iv_background"
android:layout_alignTop="#id/iv_background"
android:layout_width="wrap_content"
android:layout_marginTop="190dp"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:gravity="center"
android:text="Dummy text string"/>
</RelativeLayout>
But on different screens it looks differently.
So, by example, screenshots. The static image background (in example white image with green line), the view with text on nexus5, on nexus7.
As you can see, a text placed on different places over image.
I doesn't know why is it happend, because I'm using dp and relative layout.
I tried wrap_content/match_parent on image sizes, without ajust view bounds etc. And it haven't help.
Ty for answers.
EDIT: I want the text to always be above the green line on the same distance in different screen dimensions. (the same as in the second image)
EDIT2: Someone misunderstood me, sorry if the question isn't clear. As a background in example i'm tried to use imageview instead of background tag of relative layout, because it is'nt help whatever, i tried that before
The line, which I used in example, is only for that. It just needs to explain the issue of the text positioning
use dimens.xml to Support different size of screens.
in your res folder create some value folders Like :
values-xlarge
values-large
values-small
values-sw800dp
...
in these folders youy should have dimens.xml and define your dimensions.
for example this may be your dimensions for normal screens :
<?xml version="1.0" encoding="utf-8"?>
<resources>
<dimen name="ImageViewWidth">500dp</dimen>
<dimen name="ImageViewHeight">900dp</dimen>
<dimen name="TextViewMarginTop">190dp</dimen>
</resources>
Definitely your dimensions for large or xlarge screens are different!
to use these, simply put them in XML instead of hard-coding dimens
<TextView
android:layout_alignLeft="#id/iv_background"
android:layout_alignStart="#id/iv_background"
android:layout_alignEnd="#id/iv_background"
android:layout_alignRight="#id/iv_background"
android:layout_alignTop="#id/iv_background"
android:layout_width="wrap_content"
android:layout_marginTop="#dimens/TextViewMarginTop"
android:layout_height="wrap_content"
android:layout_centerHorizontal="true"
android:gravity="center"
android:text="Dummy text string"/>
If you just want green color as a background of text then use android:background on textview and remove ImageView. Create a 9Patch image with green line at bottom and give that image as background to your text.
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="#drawable/abc_ab_transparent_light_holo"
android:text="Dummy text string"
android:id="#+id/dummy_text" />
I don't know if I understand the question,
but I think solution could be putting RelativeLayout in another contener, ie:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center">
<RelativeLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#android:color/black"
android:padding="#dimen/default_view_padding" >
<ImageView
android:id="#+id/iv_background"
android:layout_width="500dp"
android:layout_height="900dp"
android:layout_centerInParent="true"
android:adjustViewBounds="true"
android:src="#drawable/example" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignEnd="#id/iv_background"
android:layout_alignLeft="#id/iv_background"
android:layout_alignRight="#id/iv_background"
android:layout_alignStart="#id/iv_background"
android:layout_alignTop="#id/iv_background"
android:layout_centerHorizontal="true"
android:layout_marginTop="190dp"
android:gravity="center"
android:text="Dummy text string" />
</RelativeLayout>
</LinearLayout>
set android:gravity="center", android:layout_centerInParent="true" and android:layout_alignParentTop="true" of the textview
Create a custom view like my sample:
layout view_product_image.xml
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/rlParent"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#drawable/background_light_blue"
android:orientation="vertical" >
<ImageView
android:id="#+id/imgProduct"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="3dip"
android:src="#drawable/main0x" />
<TextView
android:id="#+id/tvQty"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/imgPoduct"
android:layout_marginLeft="3dp"
android:layout_marginTop="2dp"
android:background="#color/lightBlue3"
android:text="1111"
android:textColor="#color/red"
android:textSize="16dip" />
<TextView
android:id="#+id/tvInfo"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#id/imgProduct"
android:layout_centerHorizontal="true"
android:gravity="center_horizontal"
android:lines="2"
android:maxLines="2"
android:minLines="2"
android:singleLine="false"
android:text="TextView"
android:textColor="#color/black"
android:textSize="16dip" />
</RelativeLayout>
Class:
package org.mabna.order.ui;
import org.mabna.order.R;
import org.mabna.order.businessLayer.db.BoPreferences;
import org.mabna.order.utils.Farsi;
import android.content.Context;
import android.graphics.Typeface;
import android.util.AttributeSet;
import android.view.LayoutInflater;
import android.view.MotionEvent;
import android.view.View;
import android.view.View.OnTouchListener;
import android.widget.ImageView;
import android.widget.LinearLayout;
import android.widget.RelativeLayout;
import android.widget.TextView;
public class ImageView_Product extends LinearLayout implements OnTouchListener {
private static final float FONT_SIZE_LARGE = 20;
private static final float FONT_SIZE_NORMAL = 16;
private static final float FONT_SIZE_SMALL = 12;
private RelativeLayout rlParent;
private ImageView imgProduct;
private TextView tvInfo;
private TextView tvQty;
private double qty = 0;
private float mDensity;
private Typeface tf;
public ImageView_Product(Context context) {
super(context);
initialize();
}
public ImageView_Product(Context context, AttributeSet attrs) {
super(context, attrs);
initialize();
}
protected void initialize() {
if (!this.isInEditMode()) {
tf = Farsi.getFarsiFont(this.getContext());
}
mDensity = this.getResources().getDisplayMetrics().density;
LayoutInflater layoutInflater = (LayoutInflater) getContext()
.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
View view = layoutInflater
.inflate(R.layout.view_product_image, this);
rlParent = (RelativeLayout) view.findViewById(R.id.rlParent);
imgProduct = (ImageView) view.findViewById(R.id.imgProduct);
tvInfo = (TextView) view.findViewById(R.id.tvInfo);
tvQty = (TextView) view.findViewById(R.id.tvQty);
tvInfo.setTypeface(tf);
tvInfo.setTextSize(FONT_SIZE_SMALL);
}
public TextView getTextView() {
return tvInfo;
}
public ImageView getImageView() {
return imgProduct;
}
public TextView getQtyView() {
return tvQty;
}
public void setInfoText(String text) {
tvInfo.setText(text);
}
public String getInfoText(String text) {
return tvInfo.getText().toString();
}
public void setQty(double value) {
this.qty = value;
if (this.qty > 0) {
tvQty.setText(BoPreferences.getStringValueNoGrouping(this.qty,
getContext()));
setStateHasQty();
} else {
tvQty.setText("");
setStateHasNotQty();
}
}
public double getQty() {
return Double.valueOf(tvQty.getText().toString());
}
public void setStateSelected() {
imgProduct.setBackgroundResource(R.drawable.border06);
}
public void setStateNotSelected() {
imgProduct.setBackgroundResource(R.drawable.border05);
}
private void setStateHasQty() {
tvQty.setBackgroundResource(R.color.lightBlueTransparent);
tvQty.setTextSize(FONT_SIZE_LARGE);
// tvInfo.setBackgroundResource(R.color.darkGreen);
rlParent.setBackgroundResource(R.drawable.background_light_green);
}
private void setStateHasNotQty() {
tvQty.setBackgroundResource(0);
tvQty.setTextSize(FONT_SIZE_NORMAL);
// tvInfo.setBackgroundResource(R.color.lightBlue3);
rlParent.setBackgroundResource(R.drawable.background_light_blue);
}
#Override
public boolean onTouch(View v, MotionEvent event) {
// TODO Auto-generated method stub
return false;
}
public void setImageSize(int width, int height) {
RelativeLayout.LayoutParams lp = (RelativeLayout.LayoutParams)
imgProduct.getLayoutParams();
lp.width = (int) (width * mDensity);
lp.height = (int) (height * mDensity);
imgProduct.setLayoutParams(lp);
tvInfo.setMaxWidth(lp.width);
}
}
I think I understand your problem. Here I've aligned the image to the left and right of the text and set the ImageView and TextView layout_width to wrap_content. I have used android:layout_below and given it a top margin.
This appears to work on all screen sizes.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#android:color/white"
android:padding="20dp">
<TextView
android:id="#+id/tv_example"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="190dp"
android:layout_centerHorizontal="true"
android:gravity="center"
android:text="Dummy text string"/>
<ImageView
android:id="#+id/iv_background"
android:layout_width="wrap_content"
android:layout_height="4dp"
android:layout_alignLeft="#+id/tv_example"
android:layout_alignRight="#id/tv_example"
android:layout_marginTop="4dp"
android:layout_below="#+id/tv_example"
android:adjustViewBounds="true"
android:layout_centerInParent="true"
android:src="#drawable/example"/>
</RelativeLayout>
You can change the height and top margin of the ImageView if you wish.
Use LinearLayout instead of RelativeLayout:
<?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:orientation="vertical" >
<ImageView
android:id="#+id/iv_background"
android:layout_width="500dp"
android:layout_height="900dp"
android:adjustViewBounds="true" />
<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="190dp"
android:gravity="center"
android:text="Dummy text string" />
</LinearLayout>
Second Solution is use android:drawablePadding=""and android:drawableBottom="" in TextView.
<?xml version="1.0" encoding="utf-8"?>
<TextView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:drawablePadding=""
android:drawableBottom=""
android:gravity="center"
android:text="Dummy text string" >
</TextView>

Imageview relative layout - changes position on picture taken

I have an imageview whose image(here) is loaded from a asset file onCreateInstance() and the same imageview is rotated and loaded with the images taken from a camerahere (using camera API on picture taken). The imageview changes position when rotated and moves around every time i take a new picture.
Here is the relative layout structure:
<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="match_parent"
tools:context=".MainPage" >
<Button
android:id="#+id/button1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_centerHorizontal="true"
android:layout_marginBottom="16dip"
android:onClick="uploadFile"
android:text="Upload" />
<TextView
android:id="#+id/ins"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_centerHorizontal="true"
android:layout_marginTop="26dp"
android:text="Please scan the QR code on the package to retrieve the package ID"
android:textAppearance="?android:attr/textAppearanceSmall" />
<Button
android:id="#+id/scan"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_below="#+id/ins"
android:layout_centerHorizontal="true"
android:layout_marginTop="21dp"
android:onClick="scan"
android:text="Scan" />
<Button
android:id="#+id/captureFront"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_above="#+id/button1"
android:layout_centerHorizontal="true"
android:layout_marginBottom="26dp"
android:onClick="onClick"
android:text="Camera" />
<ImageView
android:id="#+id/result"
android:layout_width="200dip"
android:layout_height="150dip"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:contentDescription="#string/imageView"
android:scaleType="fitXY"
android:src="#drawable/ic_launcher" />
</RelativeLayout>
The following code shows how the imageview is loaded with images (programatically)
imageView.setImageBitmap(loadDataFromAsset());
public Bitmap loadDataFromAsset() {
InputStream in = null;
try {
in = getAssets().open("signBG.jpeg");
} catch (IOException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
Bitmap bmp = BitmapFactory.decodeStream(in);
return bmp;
}
The above code is called via OnCreateInstance() and
The following code updates the imageview onResume
#Override
public void onResume() {
super.onResume();
setImage();
}
and when the activity resumes (OnResume())
private void setImage(){
if(constants.picTaken){
bitmap = loadPicture("sign.jpeg", bitmap) ;
uploadButton = (Button)findViewById(R.id.button1);
uploadButton.setEnabled(true);
insLabel = (TextView)findViewById(R.id.ins);
insLabel.setText("Please upload on confirmation");
if (bitmap != null) {
//Toast.makeText(this, "not null", Toast.LENGTH_SHORT).show();
imageView.setImageBitmap(bitmap);
imageView.setPivotX(imageView.getHeight()/2);
imageView.setPivotY(imageView.getWidth()/2);
imageView.setRotation(90);
}
}
}
Please do refer to the two images i have linked, for references.
Can the images look consistent as seen loading from the asset file?
This is pretty much a shot in the dark since I can't see both images until the link is fixed in the question.
The problem might be with the rotation, which I believe is occurring after the ImageView is positioned in the layout, then rotated 90 degrees around it's center. Here that rotation pivot is the center of the view if it wouldn't have been rotated.
If that is the case, the best suggestion would be to rotate the bitmap that is being use in the view, instead of rotating the view.

Categories

Resources