Android - Dynamically add an image view to a ScrollView - android

I'm pretty new to Android and need a bit of help with some code.
Basically I have an array of coins and I want to dynamically display images for the coins in a ScrollView. Each time the user adds a coin the view should update appropriately.
Thank you!
Here is a screenshot of what I want to do - http://i.imgur.com/3l2fxKw.png

Try this sample
MainActivity
public void onCreate(Bundle bundle) {
super.onCreate(bundle);
setContentView(R.layout.activity_main);
LinearLayout linearLayout1 = (LinearLayout) findViewById(R.id.linearLayout1);
for(int x=0;x<3;x++) {
ImageView image = new ImageView(MainActivity.this);
image.setBackgroundResource(R.drawable.ic_launcher);
linearLayout1.addView(image);
}
}
activity_main.xml
<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=".MainActivity" >
<ScrollView
android:id="#+id/scrollView1"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="match_parent"
android:layout_height="match_parent" >
</LinearLayout>
</ScrollView>
</LinearLayout>

Look into using SurfaceView.
You will have a canvas object to draw your images on, and then aligning the coins is just a matter of mapping your pixels appropriately.
This is a good tutorial:
http://www.mindfiresolutions.com/Using-Surface-View-for-Android-1659.php

Use a GridView instead and customize your own adapters. Gridview works like ListView

Related

Need advice on how to implement this view in Android?

I am trying to implement a screen like this:
The view could be scrolled horizontally and inside each of them they could be scrolled vertically. The number of items in each is arbitrary.
Currently I am thinking of implementing it using a recyclerview within a recyclerview but is there an easier way to do this?
You can use a scrollView and programatically add views in this scrollview. But i recommended recyclerview.
int countOfViews = 20;
LinearLayout root= findViewById(R.id.scrollViewRoot);
for(int i = 0; i < countOfViews; i++) {
View child = getLayoutInflater().inflate(R.layout.item_test, null);
root.addView(child);
}
XML: item_test.xml
<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">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent">
<LinearLayout
android:id="#+id/scrollViewRoot"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"></LinearLayout>
</ScrollView>

Many layouts in Scroll View in android

I want to have 3 layouts in my ScrollView but when I add them it actually doesn't scroll. I tried to put all layouts in different files, then include them, tried to put them in ListView and it doesn't work too. In this option, when I put in ScrollView the LinearLayout and there include the rest of the layouts the application show nothing. That's probably becouse I don't know how to refer to that nested layouts... This is my XML:
activity_main.xml
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<ScrollView android:layout_width="match_parent" android:layout_height="match_parent">
<LinearLayout android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
>
<include layout="#layout/first"/>
<include layout="#layout/second"/>
<include layout="#layout/third"/>
</LinearLayout>
</ScrollView>
</LinearLayout>
#EDIT views included (all are the same so I put just one):
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/first"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
>
</RelativeLayout>
And in the main activity I put the objects into layouts like this:
setContentView(R.layout.activity_main);
RelativeLayout first = (RelativeLayout) findViewById(R.id.first);
RelativeLayout second = (RelativeLayout) findViewById(R.id.second);
RelativeLayout third = (RelativeLayout) findViewById(R.id.third);
...some code creating views...
first.addView(myView1);
second.addView(myView2);
third.addView(myView3);
Need to put fix size in included layout, for example:
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/first"
android:layout_width="match_parent"
android:layout_height="300dp"
/>
I don`t understand why do you need to add view manually when you already added it to the layout.
You should also eliminate top Linear Layout since there is no use of it.

Zooming a layout (Relative Layout) in android

I want to zoom in and out all the images inside the layout. I have seen many questions like here and here and tried to implement them but I couldn't.
Please help me in order to understand this. My confusion is, why would I extend my class from relative layout, as described in the question above, i mean i have a relative layout in my XML and I am setting this XML in content view but how could I grab the specific relative layout by using this methodology. And even if I have extended class from relative layout, how would I use this class in the activity which contains my images inside layout.
My XML setup is like this, can anyone please tell me what approach I have to follow.
<?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:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="#dimen/activity_vertical_margin"
android:paddingLeft="#dimen/activity_horizontal_margin"
android:paddingRight="#dimen/activity_horizontal_margin"
android:paddingTop="#dimen/activity_vertical_margin"
tools:context="com.cpec.farrukhtanveer.MainActivity">
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginLeft="130dp"
android:layout_marginRight="130dp"
android:background="#drawable/imageBackGround">
<ImageView
android:id="#+id/img_one"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:visibility="invisible"
android:src="#drawable/imageone"/>
<ImageView
android:id="#+id/img_two"
android:visibility="invisible"
android:layout_width="match_parent"
android:layout_height="imagetwo"/>
</RelativeLayout>
</RelativeLayout>
Please help folks !
Thanks.
Umair
Since no one came up with solution, I kind of sort it out myself and thought it might be helpful for some one else who is stuck in this problem. The basic guidance came from here, where author implemented the zoom in and out for a single image, we just have to add images and handle other initialization as described in that tutorial.
ImageViewWithZoomClass:
private Drawable imageOne, imageTwo;
imageOne = context.getResources().getDrawable(R.drawable.icon1);
imageTwo = context.getResources().getDrawable(R.drawable.icon2);
.
.
imageOne.setBounds(0, 0, imageOne.getIntrinsicWidth(), imageOne.getIntrinsicHeight());
imageTwo.setBounds(0, 0, imageTwo.getIntrinsicWidth(), imageTwo.getIntrinsicHeight());
.
.
imageOne.draw(canvas);
imageTwo.draw(canvas);
and since I am using relative layout, I just used onClickListener in my MainActivity like this
relativeLayout.setOnClickListener(new View.OnClickListener() {
#Override
public void onClick(View v) {
setContentView(new ImageViewWithZoom(getApplicationContext()));
}
});
and XML for the relative layout looks like this:
<RelativeLayout
android:id="#+id/relativeLayout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_marginLeft="130dp"
android:layout_marginRight="130dp"
android:background="#drawable/abc"
android:clickable="true"
android:focusable="true"
android:focusableInTouchMode="true"
>
<ImageView
android:id="#+id/img_1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/roadandrailways"
android:visibility="invisible"/>
<ImageView
android:id="#+id/img_2"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:src="#drawable/capital"
android:visibility="invisible"/>
</RelativeLayout>
You can add multiple images in layout.
Thats it, hope it helps.

Android: Background image resize on keyboard pop up [duplicate]

This question already has answers here:
Software keyboard resizes background image on Android
(16 answers)
Closed 6 months ago.
I am developing an application in which the background image get shrink on keyboard pop-up. My .xml is as follows :
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:facebook="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#drawable/background" >
<ScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
/**
Other stuff
*/
</RelativeLayout>
</ScrollView>
</RelativeLayout>
I searched on Google and found that, to add
android:windowSoftInputMode="stateVisible|adjustPan"
in my manifest file. But its of no use.
Edit :
My Layout before key board pop up looks like :
And after pop up like:
Please check the difference in background image. In image 1 image is in size and in image 2 background image shrink-ed. I need the footer and background get shift upward on keyboard popup.
What I am missing or doing wrong please suggest me.
Just use in your onCreate() this code:
protected void onCreate(Bundle savedInstanceState) {
...
getWindow().setBackgroundDrawableResource(R.drawable.your_image_resource);
...
}
and eliminate this line in your xml:
android:background="#drawable/background"
Read more at:
http://developer.android.com/reference/android/view/Window.html
I had faced the similar issue once, mine was solved by using the below properties in manifest use it where your activity is declared.
android:windowSoftInputMode="stateHidden|adjustResize|adjustPan"
Hey can you please try adding this
android:isScrollContainer="false"
in your ScrollView. It has solved my problem once. Might help u too.
Also, add this to your activity in manifest.xml
android:windowSoftInputMode="adjustPan"
Hope it helps..!! :)
Ok if I got your question right, you want a layout with a background and a scrollview. And when the softkeyboard pops up, you want to resize the scrollview, but keep the background at full size right?
if that's what you want than I may have found a workaround for this issue:
What you can do is make 2 activities.
Activity 1:
public class StartActivity extends Activity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
Intent StartApp = new Intent(this, DialogActivity.class);
startActivity(StartApp); // Launch your official (dialog) Activity
setContentView(R.layout.start); // your layout with only the background
}
}
Activity2:
public class DialogActivity extends Activity {
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
this.getWindow().clearFlags(WindowManager.LayoutParams.FLAG_DIM_BEHIND); // get rid of dimming
this.requestWindowFeature(Window.FEATURE_NO_TITLE); //get rid of title bar (if you want)
setContentView(R.layout.dialog); //Dialog Layout with scrollview and stuff
Drawable d = new ColorDrawable(Color.BLACK); //make dialog transparent
d.setAlpha(0);
getWindow().setBackgroundDrawable(d);
}
}
start layout:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#drawable/test"> //your background
</LinearLayout>
dialog layout:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent"
android:layout_width="fill_parent">
<ScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- All your Scrollview Items -->
</LinearLayout>
</ScrollView>
</RelativeLayout>
AndroidManifest.xml
start Activity:
android:theme="#android:style/Theme.NoTitleBar.Fullscreen">
dialog Activity
android:theme="#android:style/Theme.Dialog"
android:windowSoftInputMode="adjustResize"
android:excludeFromRecents="true"
Edit:
To finish Activities at once use the following somewhere inside your DialogActivity (example: override the backbutton):
#Override
public void onBackPressed() {
Intent intent = new Intent(getApplicationContext(), StartActivity.class);
intent.setFlags(Intent.FLAG_ACTIVITY_CLEAR_TOP);
intent.putExtra("EXIT", true);
startActivity(intent);
}
and in onCreate() of StartActivity:
if (getIntent().getBooleanExtra("EXIT", false)) {
finish();
}
else {
Intent StartApp = new Intent(this, TestActivity.class);
startActivity(StartApp);
}
Screenshots!
Normal
Clicked the EditText box
After Scrolled down (ps: i put textbox inside scrollview thats why its gone ;) )
I hope this will help your out ;)
I had the same issue.
Add your outer layout background inside onCreate method as show below
getWindow().setBackgroundDrawableResource(R.drawable.login_bg);
and add your outer layout as
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:id="#+id/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_weight="1"
>
<ScrollView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="#4d000000"
><other code></ScrollView></RelativeLayout>
Add android:layout_weight="1" for the outer layout and don't set background in xml file
I think this helps someone
You should move the android:background="#drawable/background" in an ImageView above ScrollView. When the keyboard pops up it effectivly makes the screen smaller, and having an image as background you have no control on how it is resized/cropped.
So, assuming you want to have the image full width but keep the ascpect ratio try this:
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:facebook="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ImageView
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:src="#drawable/background"
android:scaleType="centerCrop" />
<ScrollView
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<RelativeLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content" >
/**
Other stuff
*/
</RelativeLayout>
</ScrollView>
</RelativeLayout>
You can try different android:scaleType values to achive your desired effect. If you want the image to be cropped from the top instead of the default middle crop, see here on how to achieve this, or try using this library
Instead of android:windowSoftInputMode="stateVisible|adjustPan", you should change to android:windowSoftInputMode="stateVisible|adjustResize". It worked for me.
Use ScrollView as Top parent.
It will be scrolled up and down automatically when you open and close keyboard.
Why don't you do like this
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:fillViewport="true"
android:focusable="true"
android:background="#drawable/background"
android:focusableInTouchMode="true">
<RelativeLayout
android:id="#+id/relative"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:focusable="true"
android:focusableInTouchMode="true"
/**
Other stuff
*/
>
</RelativeLayout>
</ScrollView>
You should use the adjustResize option for the windowSoftInputMode setting on the Activity in your AndroidManifest.xml file.
i am using below view heirarchy and its working fine for me:
<?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" >
<ScrollView
android:id="#+id/rfqItemsParentScrollView"
android:layout_width="match_parent"
android:layout_height="wrap_content" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >

Android Layout with ListView overlaps Buttons

I can't seem to find a way to make a layout that contains a ListView that show the entire list of my contacts (its a long list), with 2 buttons one next to the other below the list.
its freaking me out, nothing i do seems to work. i searched some related quiestions and found this one: Android Layout with ListView and Buttons
but none of the alternative solutions over there is working for me.
when i look at the graphical presntation (of eclipse) it looks fine, but when i run it on my device i can only see the list of contacts. the listView overlaps the buttons.
I am using a simpleList that render on another layout that represent a row. i'm starting to suspect something i do programtically ruins it, because i ran over my java code and found no mention of the activity_contact_list that i was talking about. only connection to the row layout.
so i got this activity_contact_list.xml:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/contact_list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<ListView
android:id="#+id/list"
android:layout_width="match_parent"
android:layout_alignParentTop="true" >
</ListView>
<LinearLayout
android:id="#+id/buttons"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_weight="1.0"
android:orientation="horizontal" >
<Button
android:id="#+id/action_cancel"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Cancle" />
<Button
android:id="#+id/action_add"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Add" />
</LinearLayout>
</LinearLayout>
this is after many tries such as: using RelativeLayout instead of the LinearLayout, puting the ListView's code below the LinearLayout of the buttons, and many more..
and here is the code of the activity: ContactList.java:
public class ContactList extends ListActivity{
//some global variables for late use.
public Model model;
SimpleAdapter adapter;
List<Map<String, String>> data; /* data is a list of Map */
String[] from = {"name","phone"}; /* names of the columns */ //TODO - add date!
int[] to = {R.id.name, R.id.number};
List<Contact> contacts; /* list of contacts */
#Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
// setContentView(R.layout.activity_contact_list);
// Set up the action bar.
final ActionBar actionBar = getActionBar();
actionBar.setNavigationMode(ActionBar.NAVIGATION_MODE_STANDARD);
actionBar.setDisplayHomeAsUpEnabled(true);
model = Model.getInstance(this);
data = new ArrayList<Map<String, String>>();
contacts = fillContactsList();
fill_data();
adapter = new SimpleAdapter(this, data, R.layout.contact_list_row, from, to);
setListAdapter(adapter);
}
i commented the setContentView line cause it doesnt compile otherway...
As is said. the list works perfactly. but it overlaps the buttons at the bottom of the activity. any idea? i'm sure its something silly i'm missing..
thanks in advance!
Did you try to use Relative Layout ?
Change Linear Layout to Relative Layout that's all.
As Linear Layout Doesn't support align parent..
Edited
set List Height to mach parent.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/contact_list"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<ListView
android:id="#+id/list"
android:layout_below="#+id/buttons"
android:layout_width="match_parent"
android:layout_height="match_parent" >
</ListView>
<LinearLayout
android:id="#+id/buttons"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="2" >
<Button
android:id="#+id/action_cancel"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Cancle" />
<Button
android:id="#+id/action_add"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Add" />
</LinearLayout>
How long is your ListView. Maybe it is longer than your screen and is the LinearLayout with buttons shown outside your screen.
What happens when you rearrange with the buttons above the ListView.
EDIT:
I think you have to set a Max-size in your ListView. Maybe you can try something like this in your java-code, but I don't know if it is scrollable then...
ListView listView = (ListView) findViewById(R.id.listView):
LinearLayout.LayoutParams params = (LinearLayout.LayoutParams) listView .getLayoutParams();
params.height = 200; // or something bigger / smaller
listView .setLayoutParams(params);

Categories

Resources