I have been trying to use a ScrollView on a single ImageView with a JPG (~770 x 1024) over an AVD that's 600x800.
My main.xml is:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<ScrollView
android:id="#+id/scroller"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>
</LinearLayout>
Now, I add a single ImageView with
setContentView(R.layout.main);
ScrollView sv = (ScrollView)findViewById( R.id.scroller );
ImageView iv = new ImageView(this);
iv.setImageDrawable( new BitmapDrawable( "/sdcard/770x1024.jpg" ) ); // same happens with ScaleDrawable.
iv.setScaleType( ScaleType.CENTER_INSIDE );
sv.addView( sv ); // and it does not go any better if I use Linear Layout between the ScrollView and the ImageView.
The result is
The image was displayed in a middle of a ScrollView, wrapped with background area on top and bottom as following:
| } blank
| }
Image|
. |
. :
. :
: } blank
: }
^-scrollbar
Instead of just
Image|
. |
. |
. |
. :
I tried to set the background of the ImageView red, and it verified that the blank margins were ImageView background.
iv.setBackgroundColor( color.Red );
Where I would expect the image to take no more than its size (scaled to the AVD size) and I expect the ScrollView to let me scroll over the remainder (if any).
For some reason, I see that the drawable size is 600x1024.
Moreover
I tried to add a LinearLayout with a dummy text view such as the linear layout is a parent to the ImageView and the TextView, and the ScrollView is a parent to the LinearLayout.
LinearLayout dummy = new LinearLayout( this );
dummy.addView(iv);
TextView someTextView = new TextView( this );
someTextView.setLayoutParams(new LayoutParams( LayoutParams.FILL_PARENT, LayoutParams.WRAP_CONTENT ));
dummy.addView( someTextView );
sv.addView( dummy );
The result was very peculiar:
The entire layout was set into the height of a text-less text view (19).
______________________
| T I T L E B A R |
+--------------------+
| []<-image |
| height=19px |
. .
. .
+--------------------+
It is important for me to avoid stretching the image. I can not use FIT_XY for ScaleType.
What is the recommended way to implement a display of a page that can be potentially scrolled?
Do I have to do it manually with a plain layout and scrolling upon GestureDetector.OnScroll events?
Thanks
Shmuel
P.S: Another observation: With an image scaled-down to 600x780 (proportional scaling) it does work properly. Unfortunately, for me it is not feasible to use a set of scaled-down clones of the images.
Add this to your ImageView in the xml:
android:adjustViewBounds="true"
I've had to do something similar, that I believe should work in your scenario, but this is off my head with no testing, so YMMV:
ImageView iv = new ImageView(this);
Drawable image = new BitmapDrawable("/sdcard/770x1024.jpg");
ScrollView scrollView = (ScrollView)findViewById(R.id.scroller);
int xWidth = image.getIntrinsicWidth();
int yHeight = image.getIntrinsicHeight();
LinearLayout.LayoutParams params = new LinearLayout.LayoutParams(xWidth, yHeight);
iv.setLayoutParams(params);
iv.setImageDrawable(image);
iv.setScaleType(ImageView.ScaleType.CENTER);
scrollView.addView(iv);
I don't know offhand whether or not ScrollView allows both horizontal and vertical scrolling at the same time, or whether you'd have to put a HorizontalScrollView within a ScrollView, or if that's even possible...but this SHOULD get you the correctly sized ImageView!
If you want the image to fill the whole space I would use ScaleType.CENTER_CROP. This will crop the left and right edge of your image a bit however.
Have a look to this post.
the official answer is this :
imgPreview.setScaleType(ImageView.ScaleType.CENTER_INSIDE);
imgPreview.setAdjustViewBounds(true);
Related
I would like to have a background on my app that changes color depending on a given number. Let me elaborate some more. For example, I pass the number 40 out of 100, 2/5s of the screen should be x color, and the other 3/5s should be the other color. Here are two little diagrams:
40 / 100 40/60
+---+ +---+
| | 3/5 not filled in | | 1/3 not filled in
| | |...| 2/3 filled in
| | |...|
|...| 2/5 filled in +---+
|...|
+---+
So I was thinking I could go about making a dynamic background (giving a certain number) by drawing in the shapes. The problem is, I am not exactly sure how I would go about doing this. Where do I place the code to draw the shapes, and how exactly would I insert them into my XML file in the correct place (I already have a static color background that is up in my XML)?
Ok, you need to create an activity with two Linear Layouts. The width attribute will be set to match_parent and the height to 0dp. You will then be able to set the height with a layout weight of X %.
As an example, those layouts split the screen 25% 75% :
<LinearLayout
layout_weight="1"/>
<LinearLayout
layout_weight="3"/>
Give them an id to change values programmatically (weight and background color).
You can do it this way :
LinearLayout top = findViewById(R.id.top);
//Third Param stands for weight
LinearLayout.LayoutParams param = new LinearLayout.LayoutParams(
LayoutParams.MATCH_PARENT, 0, 1.0f);
top.setLayoutParams(param);
top.setBackgroundColor(Color.BLUE);
In a ListView getview() method, I build my layout like this :
LinearLayout layout = new LinearLayout(context);
layout.setLayoutParams(new LinearLayout.LayoutParams(LinearLayout.LayoutParams.MATCH_PARENT, 200));
layout.setWeightSum(120);
for (int i = 0; i < totalTVNumber; i++) {
LifeEvent event = getEventFromDB(cost, position);
if (event != null) {
TextView eventTV [![enter image description here][1]][1]= event.getTextView(getContext());
eventTV.setLayoutParams(new LinearLayout.LayoutParams(0, 200, getTheWeight(eventTV)));
layout.addView(eventTV);
}
}
The problem is that doing this will cause my view not to be exactly aligned vertically. Since they have the same height than the layout, I expected them to match it but some views (nearly 1 on 2) act like they have a little margin-top. Of course there is nothing like a margin-top in my code, and reading their margin onClick returns 0.
Adding layout.setGravity(Gravity.TOP); doesnt change anything, and adding eventTV.setGravity(Gravity.TOP); just put the text on the top of the TV.
Note that if I go for MATCH_PARENT intead of 200 for the event, it acts exactly as expected, but I would like the views to be a little smaller than the layout, to get a little gap between them.
In case it matters, a LinearLayout can have from 2 to 9 textviews inside, and their weight are calculated to sum to 120 (for instance 44+34+2+40). Horizontal behaviour is ok.
How can I align view on the top of my horizontal linearlayout ?
EDIT : here is a screenshot :
I've a big problem I'm trying to add an Imageview programmatically but I face a strange problem:
I've put in the XML just an empty Relative Layout matching the parent.
Code wise I'm adding an imageview to the relative layout.
Everything works, the imageview is visible and sized correctly, but the problem is that the "0,0" position is weird. It seems that it has a Top Margin while instead the Left Margin is correctly 0. Also forcing the position to "0,0" with SetX/SetY results with this wierd top border:
Image:
Code:
base_layout = (RelativeLayout) findVieById(R.id.base_layout);
image_logo = New Imageview(this);
base_layout.AddView(image_logo);
image_logo.SetPadding(0,0,0,0);
image_logo.SetX(0);
image_logo.SetY(0);
image_logo.SetImageResource(R.drawable.generic_image);
image_logo.SetVisibility(View.VISIBLE);
I don't understand why..the activity in the manifest has its usual Theme.NoTitleBar.Fullscreen flag.
Any help? It will be really appreciated!
I put together an example using RelativeLayout.LayoutParams and tried it myself and everything appears to be working fine.
base_layout = (RelativeLayout) findViewById(R.id.base_layout);
ImageView image_logo = new ImageView(this);
RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(width, height);
image_logo.setLayoutParams(lp);
base_layout.addView(image_logo);
The above shows the below effect when run.
android:theme="#android:style/Theme.NoTitleBar.Fullscreen" was used in the manifest against this Activity.
This is my first attempt at drawing an image outside of xml in all java. How can I:
Create a new imageView
Attach a drawable to the imageView
Display the imageView to the screen
Align the imageView to the bottom of the screen and centered vertically
All in java code?
Also, how can I "destroy" the image when I am done displaying it?
this "4. Align the imageView to the bottom of the screen and centered vertically" is not possible, just think about it !
so in following code i am showing imageView centered Horizontal
LinearLayout l = new LinearLayout(this);
l.setLayoutParams(new LayoutParams(LayoutParams.MATCH_PARENT,
LayoutParams.MATCH_PARENT));
l.setGravity(Gravity.CENTER_HORIZONTAL | Gravity.BOTTOM);
ImageView iv = new ImageView(this);
iv.setImageDrawable(getResources().getDrawable(R.drawable.ic_launcher));
l.addView(iv);
setContentView(l);// or add to any view to whom you want to display it !
Also, how can I "destroy" the image when I am done displaying it
it depends on the code how you displays it
i need to draw two imageviews, (+) and (-) symbols, on the bottom right corner of the screen, similar of the zoom objects from googlemaps.
I need to do it programatically, with Java, and without using XML files.
I'm trying to do with relativelayout, but i dont know how to do it. They must to be on the bottom right corner of the screen, with 5 or 10 pixels of separation between them.
How to do it?
Also will be cool if someone can tell me how to detect when a user has pressed each image.
You can use gravity.
http://developer.android.com/reference/android/widget/RelativeLayout.html#setGravity(int)
this might do it:
image.setGravity(Gravity.RIGHT | Gravity.BOTTOM);
This should work
ImageView plusImage = new ImageView(this);
RelativeLayout.LayoutParams pp = new RelativeLayout.LayoutParams(
LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT);
pp.addRule(RelativeLayout.ALIGN_PARENT_BOTTOM,RelativeLayout.TRUE);
pp.addRule(RelativeLayout.ALIGN_PARENT_RIGHT,RelativeLayout.TRUE);
pp.leftMargin = 5;
plusImage.setId(501);
plusImage.setLayoutParams(pp);
plusImage.setImageResource(R.drawable.icon);
ImageView minusImage = new ImageView(this);
RelativeLayout.LayoutParams mp = new RelativeLayout.LayoutParams(
LayoutParams.WRAP_CONTENT,LayoutParams.WRAP_CONTENT);
mp.addRule(RelativeLayout.LEFT_OF,plusImage.getId());
mp.addRule(RelativeLayout.ALIGN_PARENT_BOTTOM,RelativeLayout.TRUE);
mp.rightMargin = 5;
minusImage.setId(502);
minusImage.setLayoutParams(mp);
minusImage.setImageResource(R.drawable.icon);
//Add the images to the outer layout
((RelativeLayout)findViewById(R.id.outerlayout)).addView(plusImage);
((RelativeLayout)findViewById(R.id.outerlayout)).addView(minusImage);