android - Align images and text with GridView -
i have following design.
as can see, week days text , "column title" images not aligned gridview items.
here complete xml file:
<?xml version="1.0" encoding="utf-8"?> <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" android:weightsum="11" tools:context="com.test.me.fragments.patientresume"> <relativelayout android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="4" android:background="@drawable/gradient"> <imageview android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerinparent="true" android:id="@+id/abovelights" android:src="@mipmap/above_lights" android:contentdescription="@string/above_lights" /> <imageview android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerinparent="true" android:src="@mipmap/under_lights" android:contentdescription="@string/under_lights" /> <com.test.dashboard.view.circleimageview android:id="@+id/centerimg" android:layout_width="104dp" android:layout_height="104dp" android:layout_centerinparent="true" android:background="@mipmap/ic_default_avatar" /> <com.test.dashboard.view.widget.robotolighttextview android:id="@+id/patientname" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignleft="@id/abovelights" android:layout_aligntop="@id/abovelights" android:layout_alignright="@id/abovelights" android:layout_alignbottom="@id/abovelights" android:layout_margin="1dp" android:gravity = "center_horizontal" android:textsize="20sp" android:text="mauricio affonso" android:textcolor="@color/colorprimarydark" /> <relativelayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignparentleft="true" android:layout_centervertical="true" android:layout_marginleft="25dp"> <com.test.dashboard.view.widget.robotolighttextview android:id="@+id/took_header" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/took" android:textcolor="@color/colorprimarydark" /> <com.test.dashboard.view.widget.robotolighttextview android:id="@+id/took_content" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_below="@+id/took_header" android:gravity="center" android:text="-" android:textalignment="center" android:textcolor="@color/colorprimarydark" android:textsize="25sp" /> </relativelayout> <relativelayout android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignparentright="true" android:layout_centervertical="true" android:layout_marginright="20dp"> <com.test.dashboard.view.widget.robotolighttextview android:id="@+id/missed_header" android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/missed" android:textcolor="@color/colorprimarydark" /> <com.test.dashboard.view.widget.robotolighttextview android:id="@+id/missed_content" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignleft="@+id/missed_header" android:layout_alignright="@+id/missed_header" android:layout_below="@+id/missed_header" android:gravity="center" android:text="-" android:textcolor="@color/colorprimarydark" android:textsize="25sp" /> </relativelayout> <com.test.me.wave.wavesview android:id="@+id/waves_view" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignparentbottom="true" /> </relativelayout> <relativelayout android:layout_width="match_parent" android:layout_height="25dp" android:background="#ddf7ff"> <com.test.dashboard.view.widget.robotolighttextview android:layout_width="wrap_content" android:layout_height="match_parent" android:id="@+id/countpatient" android:textalignment="center" android:layout_centervertical="true" android:layout_centerhorizontal="true" android:textcolor="@color/colorprimarydark" android:text="1 of 1" /> </relativelayout> <relativelayout android:id="@+id/titleimages" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@color/backgroundlight"> <imageview android:id="@+id/morning" android:layout_width="wrap_content" android:layout_height="wrap_content" android:adjustviewbounds="true" android:maxwidth="30dp" android:maxheight="30dp" android:scaletype="fitcenter" android:src="@mipmap/ic_morning" /> <imageview android:id="@+id/noon" android:layout_width="wrap_content" android:layout_height="wrap_content" android:adjustviewbounds="true" android:maxwidth="30dp" android:maxheight="30dp" android:src="@mipmap/ic_noon" /> <imageview android:id="@+id/evening" android:layout_width="wrap_content" android:layout_height="wrap_content" android:adjustviewbounds="true" android:maxwidth="30dp" android:maxheight="30dp" android:src="@mipmap/ic_evening" /> <imageview android:id="@+id/bedtime" android:layout_width="wrap_content" android:layout_height="wrap_content" android:adjustviewbounds="true" android:maxwidth="30dp" android:maxheight="30dp" android:src="@mipmap/ic_bedtime" /> </relativelayout> <relativelayout android:layout_width="match_parent" android:layout_height="0dp" android:layout_weight="7" android:id="@+id/tablecontainer" android:background="@color/backgroundlight"> <gridview android:id="@+id/grid" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_above="@+id/date_layout" android:layout_margin="@dimen/activity_horizontal_margin" android:gravity="center" android:horizontalspacing="10dp" android:numcolumns="4" android:paddingleft="20dp" android:paddingright="20dp" android:stretchmode="columnwidth" android:verticalspacing="5dp" /> <com.test.me.grid.datelayout android:id="@+id/date_layout" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignparentbottom="true" android:layout_centerhorizontal="true" android:layout_marginbottom="5dp" /> <textview android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignparentleft="true" android:layout_alignparentstart="true" android:layout_aligntop="@+id/grid" android:layout_margintop="30dp" android:id="@+id/sun" android:textcolor="@color/colorprimarydark" android:layout_marginleft="7dp" android:text="sun" /> <textview android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignparentleft="true" android:layout_alignparentstart="true" android:layout_aligntop="@+id/grid" android:layout_margintop="75dp" android:textcolor="@color/colorprimarydark" android:layout_marginleft="7dp" android:id="@+id/mon" android:text="mon" /> <textview android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignparentleft="true" android:layout_alignparentstart="true" android:layout_aligntop="@+id/grid" android:layout_margintop="120dp" android:textcolor="@color/colorprimarydark" android:layout_marginleft="7dp" android:id="@+id/tue" android:text="tue" /> <textview android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignparentleft="true" android:layout_alignparentstart="true" android:layout_aligntop="@+id/grid" android:layout_margintop="167dp" android:textcolor="@color/colorprimarydark" android:layout_marginleft="7dp" android:id="@+id/wed" android:text="wed" /> <textview android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignparentleft="true" android:layout_alignparentstart="true" android:layout_aligntop="@+id/grid" android:layout_margintop="215dp" android:textcolor="@color/colorprimarydark" android:layout_marginleft="7dp" android:id="@+id/thu" android:text="thu" /> <textview android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignparentleft="true" android:layout_alignparentstart="true" android:layout_aligntop="@+id/grid" android:layout_margintop="260dp" android:textcolor="@color/colorprimarydark" android:layout_marginleft="7dp" android:id="@+id/fri" android:text="fri" /> <textview android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignparentleft="true" android:layout_alignparentstart="true" android:layout_aligntop="@+id/grid" android:layout_margintop="310dp" android:textcolor="@color/colorprimarydark" android:layout_marginleft="7dp" android:id="@+id/sat" android:text="sat" /> </relativelayout> </linearlayout>
as can see content of relativelayout titleimages , week days text should aligned gridview items i'm having different results on different phone resolutions. tried dynamically change positions:
int test[] = new int[2]; int space = grid.gethorizontalspacing(); int height = grid.getmeasuredheight() / 7; int width = grid.getcolumnwidth() / 2; int paddingtop = grid.getpaddingtop(); int paddingleft = grid.getpaddingleft(); resources r = getresources(); float spacepx = typedvalue.applydimension(typedvalue.complex_unit_dip, space + 10, r.getdisplaymetrics()) ; float paddingtoppx = typedvalue.applydimension(typedvalue.complex_unit_dip, paddingtop - 7, r.getdisplaymetrics()); float paddingleftpx = typedvalue.applydimension(typedvalue.complex_unit_dip, paddingleft - 12, r.getdisplaymetrics()); grid.getlocationinwindow(test); for(int = 0; < 7; i++){ days[i].sety(paddingtoppx + (test[1] - grid.getmeasuredheight()) + ((i +1)* (height))); } for(int = 0; < 4; i++){ icons[i].setx((paddingleftpx + test[0]) + (i) * (spacepx + width)); }
i checked different layout seems not perfect best way make view use single gridview .almost succeded have work on more logic need
<gridview android:id="@+id/grid_calender" android:layout_width="match_parent" android:layout_height="match_parent" android:paddingleft="30dp" android:paddingright="30dp" android:numcolumns="5" android:verticalspacing="0dp" />
day_view
<?xml version="1.0" encoding="utf-8"?> <relativelayout xmlns:android="http://schemas.android.com/apk/res/android" android:id="@+id/rl" android:layout_width="match_parent" android:layout_height="match_parent" android:gravity="center" android:padding="5dp"> <textview android:id="@+id/tv_new" android:layout_width="@dimen/text_height_width" android:layout_height="@dimen/text_height_width" android:layout_centerinparent="true" android:gravity="center" android:text="" android:textappearance="?android:attr/textappearancesmall" android:textcolor="@android:color/darker_gray" /> </relativelayout>
create adapter better logic needed edited code,please ignore commented codes thanks
public class customcalendaradapter extends baseadapter { static final int first_day_of_week = 0; public arraylist<day> daylist = new arraylist<>(); string[] days; context context; list<boolean> event_status; // calendar local_cal_30 = calendar.getinstance(timezone.getdefault(), locale.getdefault()); calendar cal; public customcalendaradapter(context context, arraylist<day> daylist, list<boolean> _event_status, calendar cal) { this.context = context; this.daylist = daylist; this.event_status = _event_status; this.cal = cal; cal.set(calendar.day_of_month, 1); refreshdays(); } @override public int getcount() { return days.length; } @override public object getitem(int position) { return daylist.get(position); } @override public long getitemid(int position) { return 0; } // public int getprevmonth(){ // if(cal.get(calendar.month) == cal.getactualminimum(calendar.month)){ // cal.set(calendar.year, cal.get(calendar.year-1)); // }else{ // // } // int month = cal.get(calendar.month); // if(month == 0){ // return month = 11; // } // // return month-1; // } public int getmonth() { return cal.get(calendar.month); } @override public view getview(final int position, view convertview, viewgroup parent) { view v = convertview; layoutinflater vi = (layoutinflater) context.getsystemservice(context.layout_inflater_service); if (position % 5 == 0) { v = vi.inflate(r.layout.day_view, null); textview day = (textview) v.findviewbyid(r.id.tv_new); if (position / 5 == 0) { day.settext(r.string.sunday); } else if (position / 5 == 1) { day.settext(r.string.monday); } else if (position / 5 == 2) { day.settext(r.string.tuesday); } else if (position / 5 == 3) { day.settext(r.string.wednesday); } else if (position / 5 == 4) { day.settext(r.string.thursday); } else if (position / 5 == 5) { day.settext(r.string.friday); } else if (position / 5 == 6) { day.settext(r.string.saturday); } } else { calendar cal = calendar.getinstance(timezone.getdefault(), locale.getdefault()); day dayobject = daylist.get(position); v = vi.inflate(r.layout.day_view, null); // relativelayout rl_outerview = (relativelayout) v.findviewbyid(r.id.rl); // framelayout today = (framelayout) v.findviewbyid(r.id.today_frame); // framelayout event = (framelayout) v.findviewbyid(r.id.event_frame); // framelayout disable_frame = (framelayout) v.findviewbyid(r.id.disable_frame); // framelayout selected_frame = (framelayout) v.findviewbyid(r.id.selected_frame); textview tv_date = (textview) v.findviewbyid(r.id.tv_new); calendar local_cal = calendar.getinstance(timezone.getdefault(), locale.getdefault()); tv_date.setvisibility(view.visible); // rl_outerview.setvisibility(view.visible); // selected_frame.setvisibility(view.gone); if (dayobject.getday() == 0) { // rl_outerview.setvisibility(view.gone); } else { tv_date.setvisibility(view.visible); tv_date.settext(string.valueof(dayobject.getday()));//sets date } //only show 30 days current date // if ((dayobject.getday()<local_cal.get(calendar.day_of_month) && // dayobject.getmonth() == local_cal.get(calendar.month)) || ((dayobject.getmonth() == local_cal_30.get(calendar.month))&& // dayobject.getday()>local_cal_30.get(calendar.day_of_month))) { //only show upcoming dates current date if ((dayobject.getday() < local_cal.get(calendar.day_of_month) && dayobject.getmonth() == local_cal.get(calendar.month))) { //these dates come out of 30 days(based on current date) // disable_frame.setvisibility(view.visible); } else { //rest days come here // disable_frame.setvisibility(view.gone); dayobject.setdisable_date(true); // event.setvisibility(view.gone); tv_date.settextcolor(color.white); //now compare schedule date list each date matches (int = 0; < customgridcalendarview.schedule_list.size(); i++) { try { simpledateformat format = new simpledateformat("yyyy-mm-dd"); date scheduledate = format.parse(customgridcalendarview.schedule_list.get(i).getscheduledate()); cal = calendar.getinstance(); cal.settime(scheduledate); if (dayobject.getday() == cal.get(calendar.day_of_month) && dayobject.getmonth() == cal.get(calendar.month) && dayobject.getyear() == cal.get(calendar.year) ) { //show event frame, here got match date // event.setvisibility(view.visible); // today.setvisibility(view.gone); tv_date.settextcolor(context.getresources().getcolor(r.color.colorprimary)); } } catch (parseexception e) { e.printstacktrace(); } } if (dayobject.isevent_status()) { // event.setvisibility(view.gone); // selected_frame.setvisibility(view.visible); // today.setvisibility(view.gone); tv_date.settextcolor(color.white); } else { // selected_frame.setvisibility(view.gone); tv_date.settextcolor(color.white); } //check current date if (dayobject.getyear() == local_cal.get(calendar.year) && dayobject.getmonth() == local_cal.get(calendar.month) && dayobject.getday() == local_cal.get(calendar.day_of_month)) { // today.setvisibility(view.visible); // tv_date.settextcolor(color.white); // event.setvisibility(view.gone); // tv_date.settypeface(typeface.default_bold); } else { // today.setvisibility(view.gone); } } } return v; } public void refreshdays() { boolean before_current_date = true; // clear items daylist.clear(); int lastday = cal.getactualmaximum(calendar.day_of_month) + 7; int firstday = (int) cal.get(calendar.day_of_week); int year = cal.get(calendar.year); int month = cal.get(calendar.month); //timezone tz = timezone.getdefault(); // figure size of array if (firstday == 0) { days = new string[lastday + (first_day_of_week * 6)]; } else { days = new string[lastday + firstday - (first_day_of_week + 1)]; } int j = first_day_of_week; // populate empty days before first real day if (firstday > 0) { (j = 0; j < (firstday - first_day_of_week) + 7; j++) { days[j] = ""; day d = new day(0, 0, 0, false); daylist.add(d); } } else { (j = 0; j < (first_day_of_week * 6) + 7; j++) { days[j] = ""; day d = new day(0, 0, 0, false); daylist.add(d); } j = first_day_of_week * 6 + 1; // sunday => 1, monday => 7 } // populate days int daynumber = 1; if (j > 0 && daylist.size() > 0 && j != 1) { daylist.remove(j - 1); } (int x = 0, = j - 1; < days.length; i++) { day day; if (event_status.size() > x) { day = new day(daynumber, year, month, event_status.get(x)); } else { day = new day(daynumber, year, month, false); } x++; calendar ctemp = calendar.getinstance(); ctemp.set(year, month, daynumber); //int startday = time.getjulianday(ctemp.gettimeinmillis(), timeunit.milliseconds.toseconds(tz.getoffset(ctemp.gettimeinmillis()))); days[i] = "" + daynumber; daynumber++; daylist.add(day); } } }
Comments
Post a Comment