To Set ColSpan or RowSpan of any item to float number like 1.5(In Facebook Image Grids in feeds it has each item colSpan 2 or 1 or 1.5)
Closed this issue · 11 comments
Why don't simply make a gridview with colCount 6 and then use Items with a colSpan of 2, 3 and 4 ?
This the should look something like this:
what @Steve2955 said should be sufficient. BTW is that screenshot from an app on the Play Store? I'd love to take a look 😄
@felipecsl The screenshot is not from an app on the playstore. I'm currently in the 10th grade and here in Germany we have to write something called a "Seminarfacharbeit". It's basicly a scientific paper you have to write in a team and it has to be submited until the 12th grade. If you've done this well enough, you don't have to do a second oral exam. Me and my team decided to make an app, which will help users to learn better and more efficent, by analysing their strengths and weaknesses. The app shown in the screenshot is just a compilation of examples, I made for the other members of my team, to show how we could design the start page of the app. In the end we decided to use a asymmetric gridview, so we can make more important topics larger and not so important ones smaller.
And finally I want to thank you for this awesome library you made, it saved me a lot of work and I hope you will continue making it even more awesome.
@felipecsl one more question is it able to confined height of this grid view same as width or wrap content. I am using this library for viewing images in grid (same as Facebook app in feeds) .So i have to specify both height and width of Asymmetric grid View with wrap content.
@singhania1408 no, I don't think this will work with wrap content, you'd have to either set fixed dimensions or match_parent
@felipecsl ColSpan or RowSpan is not working greater than 2.Please help me out I have implemented your library already.
@singhania1408 As you can see in the screenshot, I already posted, ColSpan or RowSpan greater than 2 is working. If for some reason this doesn't work for you, you have to give a more detailed description.
@Steve2955 Check this Code i am using this one in my Adapter .It is going correct for two images(1 colSpan) but going wrong for 3 and 4 sets of images.
public class AttachmentSetTask extends AsyncTask<Void, Void, PerAttachmentViewModel> {
String attachment;
WeakReference<AsymmetricGridView> attachmentReference;
List<AsymmetricImageModel> items;
AttachmentSetTask(String attachemnt, AsymmetricGridView asymmetricGridView) {
this.attachment = attachemnt;
items = new ArrayList<AsymmetricImageModel>();
attachmentReference = new WeakReference<AsymmetricGridView>(asymmetricGridView);
}
@Override
protected PerAttachmentViewModel doInBackground(Void... params) {
PerAttachmentViewModel perAttachmentViewModel = new PerAttachmentViewModel();
try {
JSONArray dataArray = new JSONArray(attachment);
int length = dataArray.length();
int colSpan = 1, rowSpan = 1, padding = 0;
int columnCount = 1, rowCount = 1;
switch (length) {
case 1:
columnCount = rowCount = 1;
padding = 0;
break;
case 2:
columnCount = 2;
rowCount = 1;
padding = 2;
break;
case 3:
colSpan = 2;
rowSpan = 2;
padding = 100;
columnCount = 5;
rowCount = 4;
break;
case 4:
columnCount = 3;
rowCount = 3;
padding = 30;
break;
default:
columnCount = 5;
rowCount = 6;
padding = 3;
}
int colWidth = (width) / columnCount;
int viewHeight = colWidth * rowCount;
//viewHolder.asymmetricGridView.setRequestedColumnWidth(colWidth);
perAttachmentViewModel.setViewHeight(viewHeight);
perAttachmentViewModel.setColCount(columnCount);
int hasmore = 0;
if (length > 5)
hasmore = length - 5;
for (int i = 0; i < length; i++) {
if (length == 3) {
colSpan = (i == 0) ? 3 : 2;
rowSpan = (i == 0) ? 4 : 2;
} else if (length == 4) {
colSpan = (i == 0) ? 3 : 1;
rowSpan = (i == 0) ? 2 : 1;
} else if (length == 5) {
colSpan = (i == 0 || i == 1) ? 3 : 2;
rowSpan = (i == 0 || i == 1) ? 3 : 2;
}
AsymmetricImageModel asymmetricImageModel = new AsymmetricImageModel(colSpan, rowSpan, i, hasmore);
JSONObject perObject = dataArray.getJSONObject(i);
ImageModel imageModel = new ImageModel();
imageModel.setImageUrl(mCommon.getvalue(perObject, Constants.BIGURL));
imageModel.setId(mCommon.getvalue(perObject, Constants.ID));
if (perObject.has(Constants.LIKES))
imageModel.setLikeCount(mCommon.getvalue(perObject, Constants.LIKES));
if (perObject.has(Constants.LIKEBYME))
imageModel.setLikeCount(mCommon.getvalue(perObject, Constants.LIKEBYME));
asymmetricImageModel.setImageModel(imageModel);
items.add(asymmetricImageModel);
}
adapter = new DemoAdapter(context, items, feed_id);
perAttachmentViewModel.setDemoAdapter(adapter);
Log.v(TAG, "Feeds Adapter Called having Attachment");
/*ImageListAdapter imageListAdapter=new ImageListAdapter(context,android.R.layout.simple_list_item_1,list,list.size());
viewHolder.asymmetricGridView.setAdapter(imageListAdapter);*/
} catch (JSONException e) {
e.printStackTrace();
}
return perAttachmentViewModel;
}
@Override
protected void onPostExecute(final PerAttachmentViewModel success) {
AsymmetricGridView asymmetricGridView = attachmentReference.get();
RelativeLayout.LayoutParams layoutParams = new RelativeLayout.LayoutParams(ViewGroup.LayoutParams.MATCH_PARENT, success.getViewHeight());
layoutParams.setMargins(0, 15, 0, 0);
layoutParams.addRule(RelativeLayout.BELOW, R.id.summary);
asymmetricGridView.setLayoutParams(layoutParams);
asymmetricGridView.setVisibility(View.VISIBLE);
asymmetricGridView.setRequestedHorizontalSpacing(0);
asymmetricGridView.setRequestedColumnCount(success.getColCount());
asymmetricGridView.setAllowReordering(false);
AsymmetricGridViewAdapter asymmetricAdapter =
new AsymmetricGridViewAdapter<>(context, asymmetricGridView, success.getDemoAdapter());
asymmetricGridView.setAdapter(asymmetricAdapter);
}
}
I have read in your previous issues about problems in more than 2 colSpan that's why i am raising this problem.
@felipecsl @Steve2955 Please reply me as soon as possible.
Caveats
Currently only has good support for items with rowSpan = 2 and columnSpan = 2. In the near future it will support different layout configurations.
It is mentioned in your ReadMe File.
it will work with rowspan/colspan greater than 2, it just might not look good since there's a greater chance you'll end up with more gaps in your grid