i am trying to create a tablelayout to show one user's profile picture and his name.Everything works fine except the layout is wired. the image view overflow the tablerow. i set the tablerow layout_height="70dp" and iamgeview layout_height ="50dp" and layout_margin="10dp" in order to vertically centrallize the image.
tablerow xml:
<?xml version="1.0" encoding="utf-8"?>
<TableRow xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent" android:layout_height="70dp"
android:orientation="horizontal"
android:layout_marginBottom="1dp"
android:background="#fff">
<ImageView
android:layout_height="50dp"
android:layout_width="50dp"
android:id="#+id/pic"
android:layout_marginTop="10dp"
android:layout_marginLeft="10dp"
android:background="#f00"/>
<TextView
android:layout_height="20dp"
android:layout_width="wrap_content"
android:layout_marginTop="25dp"
android:layout_marginRight="25dp"
android:id="#+id/value"
android:textColor="#000"
android:layout_alignParentRight="true"
android:layout_weight="3.0"
android:textAlignment="gravity"
android:gravity="right"
/>
</TableRow>
tablelayout xml:
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#fff">
<TableLayout android:id="#+id/contact_table"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:background="#aaa">
</TableLayout>
</ScrollView>
java code:
table =(TableLayout)findViewById(R.id.contact_table);
LayoutInflater inflater = getLayoutInflater();
TableRow row = (TableRow)inflater.inflate(R.layout.profilerow, table, false);
ImageView tag = (ImageView)row.findViewById(R.id.pic);
new DownloadImageTask(tag).execute(me.getDp_address());
TextView value = (TextView)row.findViewById(R.id.value);
value.setText(me.getFirst_name()+" "+me.getLast_name());
table.addView(row);
TableRow row2 = (TableRow)inflater.inflate(R.layout.centertextrow,table ,false);
table.addView(row2);
private class DownloadImageTask extends AsyncTask<String,Void,Bitmap>{
ImageView img;
public DownloadImageTask(ImageView bmImage){
this.img = bmImage;
}
#Override
protected Bitmap doInBackground(String... urls) {
String url_string = urls[0];
Bitmap micoin = null;
try {
InputStream in = new java.net.URL(url_string).openStream();
micoin = BitmapFactory.decodeStream(in);
} catch (IOException e) {
Log.i("michaellog","error a");
//Log.e("michaellog",e.getMessage());
e.printStackTrace();
}
return micoin;
}
#Override
protected void onPostExecute(Bitmap bitmap) {
super.onPostExecute(bitmap);
img.setImageBitmap(bitmap);
}
}
here is an image of how it looks like:link
the image shift down.
Aloha!
I ran into the same type of problem when creating a list of youtube feeds that was put into a table view for our university app. The only difference I see from my layout and yours is I have added a android:scaleType="centerCrop" to the tableview cell that is created. This should scale your image to fit in the correct area. I am also using a linear layout instead of the tableRow type for each cell in the table that gets populated. I would also check out the answer here as well. https://stackoverflow.com/a/15832564/877568
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout android:id="#+id/semesterButtonLL"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android">
<ImageView android:layout_width="50dip"
android:id="#+id/image"
android:src="#drawable/icon72"
android:layout_height="50dip"
android:scaleType="centerCrop">
</ImageView>
<TextView android:text="TextView"
android:id="#+id/text"
android:textColor="#color/usu_blue"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="left|center_vertical"
android:textSize="20dip"
android:layout_marginLeft="10dip">
</TextView>
</LinearLayout>
As for the code you provided everything looks ok on how you are bringing the data in and if it is displaying the image on the link you provided then it may be as simple as adding the centerCrop to the line in your xml. I hope this helps.
Related
I'm kinda new to android studio and most of my work was done referring to Stack Overflow answered questions and topics cutting short to the question.
my JSON is as such:
[
{ "name":"station1",
"url":"http://example1.com",
"image":"R.drawable.radio1"
},
{ "name":"station2",
"url":"example2.com",
"image":"R.drawable.radio2"
}
]
and so on,
and my XML is
<HorizontalScrollView
android:id="#+id/horizontalScrollView1"
android:layout_width="fill_parent"
android:layout_height="100dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toRightOf="parent"
tools:layout_editor_absoluteY="0dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal">
<RelativeLayout
android:id="#+id/relative1"
android:layout_width="100dp"
android:layout_height="100dp"></RelativeLayout>
</LinearLayout>
</HorizontalScrollView>
I need to load the image and name in a scroll view horizontally created dynamically every time I add another "name and image" to the JSON file please can someone help me with a code (the text below every image that loads).
First i suggest to create a class BEAN like this:
public class MyBean{
String name;
String url;
String image;
}
Now, as GrIsHu describes in their answer here:
you need to read the Json File from your assests file using below code:
public String loadJSONFromAsset() {
String json = null;
try {
InputStream is = getActivity().getAssets().open("yourfilename.json");
int size = is.available();
byte[] buffer = new byte[size];
is.read(buffer);
is.close();
json = new String(buffer, "UTF-8");
} catch (IOException ex) {
ex.printStackTrace();
return null;
}
return json;
}
After, transform the Json String into JsonArray like this:
JSONArray ja = new JSONArray(loadJSONFromAsset());
Now you can popolate a
List<MyBeen.class> lst
like this:
for (int i = 0; i < ja.length(); i++) {
lst.add(gSon.fromJson(ja.get(i).toString(), MyBeen.class));
}
first to all do you need to change HorizontalScrollView in ListView
https://developer.android.com/guide/topics/ui/layout/listview.html
, as:
<LinearLayout
android:id="#+id/fullscreen_content_controls"
style="?metaButtonBarStyle"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical"
tools:ignore="UselessParent">
<ListView
android:id="#+id/lstView"
android:layout_margin="5dp"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:divider="#android:color/transparent"
android:dividerHeight="10.0sp">
</ListView>
</LinearLayout>
When you add a in MainClass this code for work with ListView:
ListView listView = findViewById(R.id.lstView);
listView.setAdapter(new CustomAdapter(this, lst));
After, in CustomAdapter.java, need:
public class CustomAdapter extends BaseAdapter {
public CustomAdapter(MainClass mainActivity, List<?> iLst) {
lst = iLst;
context=mainActivity;
inflater = ( LayoutInflater )context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);
}
#Override
public View getView(final int position, View convertView, ViewGroup parent) {
View rowView;
rowView = inflater.inflate(R.layout.listview_custom, null); <-- RAPPRESENTE A SINGLE ROW LAYOUT
ImageView img = (ImageView) rowView.findViewById(R.id.customImg);
TextView text =(TextView) rowView.findViewById(R.id.customText);
return rowView;
}
}
At end, you add the XML layout for a single row, it will duplicate automatically for each row:
<?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:background="#drawable/border_radius"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:weightSum="1"
android:orientation="horizontal">
<LinearLayout
android:layout_width="0sp"
android:layout_weight=".2"
android:layout_height="match_parent"
android:layout_gravity="center"
android:gravity="center">
<ImageView
android:id="#+id/customImg"
android:layout_width="50sp"
android:layout_height="45sp"
android:drawableTint="#color/White"
android:background="#drawable/upload"
android:tint="#color/White"/>
</LinearLayout>
<LinearLayout
android:layout_width="0sp"
android:layout_weight=".6"
android:layout_height="wrap_content"
android:orientation="vertical">
<TextView
android:id="#+id/customText"
android:paddingTop="5dp"
android:paddingLeft="5dp"
android:paddingRight="5dp"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:textSize="20dp"
android:ellipsize="none"
android:scrollHorizontally="false"
android:maxLines="100"
android:textColor="#color/White"
android:text="Title" />
</LinearLayout>
</LinearLayout>
</LinearLayout>
I have an axml file:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:id="#+id/mylinearlayout"
android:orientation="vertical"
android:configChanges="orientation|keyboardHidden"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<SurfaceView
android:id="#+id/surfaceView"
android:layout_height="1dip"
android:layout_width="1dip" />
<ScrollView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="#+id/scrollView1">
<LinearLayout
android:id="#+id/filesScrollerLayout"
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
</ScrollView>
<VideoView
android:layout_width="1dip"
android:layout_height="1dip"
android:id="#+id/videoView1" />
My application takes a photo and video and puts it in the LinearLayout.
When I add video, I create an ImageView dynamically, put the firstframe of the video in this ImageView and add it in LinearLayout.
private void addBitmapToLayout(Bitmap bitmap)
{
ImageView iv = new ImageView(this);
iv.SetImageBitmap(bitmap);
linearlayout.AddView(iv);
}
How can I put a button over this ImageView in LinearLayuot dynamically to start the video?
Like this
Thank you.
Instead of adding an ImageView to your LinearLayout, add a custom layout where you'll have your ImageView as well as a Button on top
Define the layout for each item in your list :
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ImageView
android:id="#+id/imageView"
android:layout_width="match_parent"
android:layout_height="match_parent">
<Button
android:id="#+id/button"
android:layout_centerInParent="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
</RelativeLayout>
Your function now becomes :
private void addBitmapToLayout(Bitmap bitmap) {
LayoutInflater inflater = LayoutInflater.from(context);
RelativeLayout layout = inflater.inflate(R.layout.list_item, null, false);
ImageView iv = (ImageView) layout.findViewById(R.id.imageView);
iv.SetImageBitmap(bitmap);
//Add click listener to your Button etc...
Button button = (Button) layout.findViewById(R.id.button);
linearlayout.AddView(layout);
}
Im trying to make a grid view with ImageButtons dynamically and i have this problem.
before starting i must say I'm new with android and java development (2.5 years of Objective-c).
Ok. so im using this code:
#Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_background);
ArrayList<ImageButton> tmpStrRay = new ArrayList<ImageButton>();
Boolean load=true;
for (int i= 0;load;i++){
ImageButton iv = new ImageButton(this);
InputStream ims;
try {
ims = getAssets().open("sm_backgrounds/bgSM_"+i+".jpg");
Drawable d = Drawable.createFromStream(ims, null);
iv.setImageDrawable(d);
tmpStrRay.add(iv);
} catch (IOException e) {
load = false;
e.printStackTrace();
}
System.out.print(i);
}
GridView grid = (GridView) findViewById(R.id.gridView);
ArrayAdapter<ImageButton> adapter = new ArrayAdapter<ImageButton>(this, android.R.layout.simple_list_item_1, tmpStrRay);
grid.setAdapter(adapter);
}
and i have this XML in my layout:
<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=".BackgroundSelector" >
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:orientation="horizontal"
android:id="#+id/topLinear">
<Button
android:id="#+id/button1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:onClick="close"
android:text="Close"
android:textSize="15sp" />
<Button
android:id="#+id/Button01"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:onClick="showCamera"
android:text="Camera"
android:textSize="15sp" />
</LinearLayout>
<ScrollView
android:id="#+id/scrollView1"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_alignParentRight="true"
android:layout_below="#+id/topLinear" >
<GridView
android:id="#+id/gridView"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:numColumns="3" >
</GridView>
</ScrollView>
</RelativeLayout>
and I'm getting this strange result of Grid with text the normally i will say that describe the ImageButton instead of showing the button himself.
I'm sure its an easy for the most of you - but please if you have the answer i would really like to get an explanation with it.
Thanks !!!
You use ArrayAdapter adapter which takes android.R.layout.simple_list_item_1 layout (which is TextView) and fills this textView with tmpStrRay[i].toString() text.
To use something other than TextViews for the array display, for instance, ImageViews, or to have some of data besides toString() results fill the views, override getView(int, View, ViewGroup) to return the type of view you want.
I am trying to display a simple ImageView in a TableRow but for some reason it won't display. If I add another control to another row the imageView does display, so it seems like it is just not forcing the size correctly. My xml is as follows:
<TableLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_height="fill_parent"
android:layout_width="fill_parent"
android:background="#4B088A"
android:id="#+id/ImageTable">
<TableRow android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:padding="5dp"
android:id="#+id/ImageTableRow"/>
</TableLayout>
The code that I am using to add the ImageView is:
TableLayout tableLayout = (TableLayout) findViewById(R.id.ImageTable);
TableRow tr = new TableRow(this);
TableRow.LayoutParams lp = new
TableRow.LayoutParams(TableRow.LayoutParams.MATCH_PARENT ,TableRow.LayoutParams.WRAP_CONTENT);
tr.setLayoutParams(lp);
m_imageView = new MyImageView(getApplicationContext());
m_imageView.setBackgroundColor(Color.GRAY);
m_imageView.setImageBitmap(charty);
tr.addView(m_imageView);
tableLayout.addView(tr);
try this code
write your xml "activity_main" as
<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" >
<TableLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
>
<TableRow
android:id="#+id/tableRow1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
>
<ImageView
android:id="#+id/image"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:src="#drawable/ic_action_search" />
</TableRow>
</TableLayout>
</LinearLayout>
ic_action_search is your image in drawable folder and write main activity as
public class MainActivity extends Activity
{
ImageView image;
#Override
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
}
}
I'm trying to have a ListView with icon and text but there is a little problem as you can see in the screen shot (only a very small part of text is visible!):
Here is the xml files creating this layout:
//The overall layout
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
android:id="#+id/LinearLayout01"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
xmlns:android="http://schemas.android.com/apk/res/android" >
<ListView
android:id="#+id/ListView01"
android:layout_width="match_parent"
android:layout_height="match_parent" >
</ListView>
</LinearLayout>
// this layout is for single rows
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="#+id/lIcon"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/lText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"/>
</LinearLayout>
Edit: This is the getView method of my custom adapter.
public View getView(int position, View convertView, ViewGroup parent) {
View myView = convertView;
cu.moveToPosition(position);
if (convertView == null) {
LayoutInflater li = getLayoutInflater();
myView = li.inflate(R.layout.listicon, null);
ImageView imageView = (ImageView) myView.findViewById(R.id.lIcon);
myView.setLayoutParams(new GridView.LayoutParams(60, 90));
myView.setPadding(8, 8, 8, 8);
byte[] b = Base64.decode(cu.getString(2),Base64.DEFAULT);
imageView.setImageBitmap(BitmapFactory.decodeByteArray(b, 0, b.length));
TextView textView = (TextView) myView.findViewById(R.id.lText);
textView.setText(cu.getString(1));
}
//cu.moveToNext();
int catID = cu.getInt(0);
myView.setTag((Object) catID);
return myView;
}
Try setting layout_width of the ListView and TextView to fill_parent
EDIT: you're resetting list item width in the getView. Either remove or correct your code
Use a relative layout for your rows and place the text right of the image as below :
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal">
<ImageView
android:id="#+id/lIcon"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />
<TextView
android:id="#+id/lText"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/lIcon"/>
</RelativeLayout>
This is related to the way single row is inflated in the adapter
You should try using
LayoutInflater#inflate(layoutId, parent, false)
as suggested in this answer:
https://stackoverflow.com/a/1662611
Try this layout for the row layout:
Adjust the IDs to yours.. also notice the android:layout_toRightOf id.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
>
<ImageView
android:id="#+id/bimage"
android:layout_height="20dip"
android:layout_width="20dip"
android:layout_gravity="left|center"
android:layout_marginTop="10dip"
android:layout_marginLeft="5dip"
android:layout_alignParentLeft="true"
android:layout_centerVertical="true"
/>
<TextView
android:id="#+id/btitle"
android:layout_toRightOf="#id/bimage"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentRight="true"
android:layout_marginTop="8dip"
android:paddingLeft="10dip"
android:paddingRight="10dip"
android:textSize="18dip"
android:textColor="#ffffff"
android:gravity="center_vertical"
/>
</RelativeLayout>