What layout to use when wanting to display over 10,000 textviews(Strings) - layout

Image below is what iv constructed already, but can see the daunting task of creating it for 40 students with 250-300 entires each...What layout would i use if i was to display over 10000 textviews(strings)?
Think of it as a table where there are 40 student names down the side of the xml layout and each of these students had its own row. In that row it displayed them being absent or present with the letter A(Absent) and P(Present).
I need each student to have at least 250 entries or textviews for the school calandar year. So as you can see 250 entries multiplied by 40 students equals alot of individual textviews which is not ideal.
I am stuck on which layout to use; ListView, GridView or is there another easier layout to display all this data that is being passed from another class using the spinners of each student? So every time a user pushes the confirm button from the class with the spinners it will take that string and pass onto the class that i want to display it. Like a roll book for school. Thanks

Forget layouts here. Better draw everything completely on your own. It may be a bit more work, but you have complete control over what's going on, you don't need any XML, and you avoid surprises with the sometimes funny, sparsely documented behavior of those layouts. As a start, you create your own View class and implement a few functions:
public class UiView extends View {
#Override
protected void onDraw(Canvas canvas) {/*...*/}
#Override
public boolean onTouchEvent(MotionEvent event) {/*...*/}
}
and put it into your main layout:
<com.mytool.UiView ...
Then you have complete freedom to tune the behavior by implementing onDraw and onTouchEvent.

Related

How to create an mgwt widget which extends from FlexPanel and TouchWidget

I have several escenarios where some mgwt widgets which do not extend TouchWidget need to be "touchable", for instance ScrollPanel or FlexPanel.
One scenario is a full screen widget wich reacts when user touches it and shows a popup.
Java do not let extending two classes, so I want to reuse code from both the widget and the TouchWidget (which has a final static TouchWidgetImpl in it)
Thanks
You don't need to make a FlexPanel into a TouchWidget. You can add a TouchWidget to a FlexPanel, and let it occupy the entire screen.

GXT live grid not scrolling to bottom

I have a GXT LiveGridView grid - works great, loading fine, but will not scroll all the way to the bottom record using the scroll bar. The only way to see the last record is to select the last visible record and use the down arrow key to force the display down, one record at a time.
By overriding the 'getCalculatedRowHeight' method, since it was returning a wrong value (compared with the Firebug analysis) the issue was resolved.
private class MyLiveGridView<T> extends LiveGridView<T> {
// deal with wrong value of 22 from this method currently.
#Override
protected int getCalculatedRowHeight(){
return 28;
}
}
(A real fix would be to dynamically acquire the correct row height. For now this will suffice since I'm on the hook for a lot of code still).

UICollectionView custom layouts

Hi I am beginning iOS development, and was playing around with UICollectionView. I was just wondering how you could achieve this type of layout. As shown below:
The idea is to have like a main news article in the big cell. Just confused how I am suppose to get two cells in the 2nd column. Much appreciated!
Create custom class which will act as layout for your collection view. This class will child class for UICollectionViewFlowLayout.
Then you can override below two methods and can create your own custom layout as you want.
- (NSArray*)layoutAttributesForElementsInRect:(CGRect)rect
- (UICollectionViewLayoutAttributes *)layoutAttributesForItemAtIndexPath:(NSIndexPath *)path
UICollectionViewLayoutAttributes is class which will deal with cell position, frame, Zindex etc
You can also use below properties.
collectionView:layout:minimumInteritemSpacingForSectionAtIndex:
collectionView:layout:minimumLineSpacingForSectionAtIndex:

iPhone alike sliding header, or: how to force immediate redraw on top margin change?

I am trying to implement a similar effect like the iPhone-alike sliding header in the iPhone contact app (the sliding header that group the contacts by it's starting letter).
This is the screen of my app, and what I want to achieve is the following:
I have a 'guide header' and three 'tabs' for sorting the list. When the user scrolls the list up, I want everything to scroll up (guide header, tabs, list). However, when the tabs reach the top of the screen (and the guide header will just be gone off the screen), I want the tabs to stop and stay there (remain as "sticky header"), and only the list items scroll as in any regular list view.
I have a view group (guide header) above a list view.
First of all, I want to have the guide header adjust it's position depending on the scrolling position of the list view.
First approach:
My idea was to set an onScrollListener to the list view and change the top margin of the guide header to whatever the scroll position of the first item in the list view is (which would be a negative value).
The logic is correct, but the problem I'm facing is that the guide header view doesn't get redrawn fast enough while I'm scrolling in the list view. The guide header view only updates (to my changed top margin value) when the list view fling comes to an end. Even slow scrolling doesn't work. Invalidating (invalidate()) the guide header view or it's parent also doesn't help, since it would just put an invalidation request to the queue, but the invalidation and redrawing doesn't happen immediately, but only when the UI thread becomes idle, which doesn't seem to happen while the user still has his fingers on the scroll list view. Seems that flinging the list view blocks the whole UI thread or keeps it busy for itself.
So the main problem is: changing the margin of the guide header view doesn't become visible immediately while the user is scrolling the list view. The code I'm using it this:
#Override
public void onScroll(final AbsListView view, final int firstVisibleItem,
final int visibleItemCount, final int totalItemCount) {
// Get the first list item and check it's scroll position. This will be the value (top), that we also
// use the scroll the header parallel.
View v = mainList.getChildAt(0);
final int top = (v==null)?0:v.getTop();
// This logs the current scroll position of the first list item element/view group.
Log.d("onScroll", "onScroll: " + top);
// Here we finally change the margin (setting a negative margin) to the header element.
((LinearLayout.LayoutParams)(findViewById(R.id.header_container).getLayoutParams())).setMargins(0, top, 0, 0);
// was just a test: invalidating the outer container/view group, doesn't help
// findViewById(R.id.ll_container).invalidate();
}
I do see the "onScroll:" log output I inserted in the code above in the logcat, but the following adjustment of the top margin just doesn't become visible.
My second approach: is to use a scrollview for the guide header + tabs and work with those. Scrolling the guide header (which is then a scroll view) from code with scrollView.scrollTo(0,Math.abs(Math.abs(top)) from the onScroll method of the list view does work and almost immediately shows on the screen, however, it's not very accurate/stable when the user flings the list view very fast - meaning it jumps in intervals and doesn't look smooth; it's only accurate/stable when scrolling slowly.
My question is now: is there any best practice to accomplish such a sliding header effect, and more concrete: is there a way to force the guide header view to be redrawn while the user is still scrolling the list view (in my first mentioned approach).
For this you should use some tricks (afaik there is no ready-to-use implementation of such a feature).
For instance, you could detect gestures on your view, and
if the current gesture matches a
scroll down, and the first list item
is visible, animate-shrink the
header's size to 0, the tab view's
size to match_parent. Start scrolling
the list only when the header is not
present anymore.
if the current gesture matches scroll
up, and the first is already visible,
animate-expand the header to it's
original size.
So using Animation on the header view might be your solution.
Update
An other workaround would be to extend your List (the value array of your adapter):
Inster a new (dummy) item at the top for the header representation, and modify your ListAdapter's getView method:
#Override
public View getView(int position, View convertView, ViewGroup parent)
{
if (position == 0)
{
convertView = inflater.inflate(R.layout.sliding_header, parent,
false);
return convertView;
}
//TODO: your original method body comes here
}
where the xml referenced by R.layout.sliding_header should contain the header layout of your list.
A custom OnScrollListener implementation applied to the ListView would make unnoticeable that the header actually is an item of the list, since it would hide the scrollbar.
You should add this listener to your listView in the activity's onCreate method:
listView.setOnScrollListener(new MyScrollListener());
where MyScrollListener is:
/**
* Custom OnScrollListener
*/
private final class MyScrollListener implements OnScrollListener
{
#Override
public void onScrollStateChanged(AbsListView view, int scrollState)
{}
#Override
public void onScroll(AbsListView view, int firstVisibleItem,
int visibleItemCount, int totalItemCount)
{
if (view.getFirstVisiblePosition() == 0)
view.setVerticalScrollBarEnabled(false);
else if (!view.isVerticalScrollBarEnabled())
view.setVerticalScrollBarEnabled(true);
}
}
I think you can also try and use my ExpandAnimation for that.
http://udinic.wordpress.com/2011/09/03/expanding-listview-items/
Just pass the animation class that "guide header" view, and let the animation do the work for you, no scrolling is needed in that case, and it's smooth.

Creating a minesweeper UI control?

I've been busy working on a program that can solve Minesweeper puzzles (for no other reason than I think it's fun). When it comes down to the UI, though, I greatly dislike the idea of instantiating over a hundred of the same control, one per cell. Should I create a custom control that handles all of its drawing and input itself? What approach do you guys suggest?
I'm using WPF, and I'm pretty new. Any pointers would be awesome.
Yes a custom control would be a good idea. Also, M-V-VM is a must in a situation like this; it will reduce the complexity of your app greatly.
I'd take a UniformGrid and use Buttons as the squares. You'd have to create a tri-state custom button if you want to add in the "?" intermediate state.
The model for the button would look like
public class MineSquare : INotifyPropertyChanged
{
// exploded, number, or nothing
pubic ImageSource ButtonImage {get;private set;}
// true, then goes to false when clicked
public bool CanClick {get; private set;}
// bound to the Command of the button
public ICommand Click {get; private set;}
}
You deal with the model in code rather than the controls. Drop in nine MineSquares into an ObservableCollection on your ViewModel bound to your UniformGrid and you have a 3x3 minesweeper game. Each button handles its own logic. You can hook into the models via the view model to iterate over all squares and determine if everybody has been clicked.
I think you should create a single, owner-drawn control. WPF is cool, but a WPF app still has the same limitations regarding the total number of controls on a form, so having a separate control for each cell in Minesweeper would still be problematic.
Minesweeper is pretty played out, though, as much as I love it myself. Maybe you could have more fun with it by making the cells hexagonal instead of rectangular, and arranging the mines so that they spell out dirty words or something.

Resources