I am developing a game app for blackberry where i want to place the buttons in a semi circle fashion on the home screen.....so far I have seen all the buttons being aligned either horizontally or vertically....is there any way out where we can place buttons at custom locations such as using a layout in android and hardcoding to place them in terms of pixels? Any help is greatly appreciated
thanks
You may do this by overriding sublayout in your field manager.
In the following example setPositionChild defines the X,Y position of the first field (field 0) added to this manager. To add additional fields increment the number in this.getField() and add the fields to hfm in the order you position them.
public HorizontalFieldManager testingXYPlacement() {
HorizontalFieldManager hfm = new HorizontalFieldManager() {
// Define the x,y, positions of the fields
protected void sublayout( int width, int height ) {
super.sublayout( width, height );
Field field = null;
field = this.getField(0);
if (field != null && equals(field.getManager())) {
setPositionChild(field, XPOS, YPOS);
}
setExtent( width, height);
}
};
hfm.add(new ButtonField("hello!"));
return hfm;
}
if you are used custom button than sometimes set margin is not working properly so used button.setpadding for place your desire location .please keep USEALLWIDTH for your Horizontal or Vertical layout
If your layout is a RelativeLayout you can position elements relative to other elements within the layout (or to the entire RelativeLayout). This directly lets you place views next to other views, and you can apply margins to offset the views from others.
Related
I am creating a app for both android and ios using xamarin and mvvmcross.
In the ios app I want to add outer vertical stackview having nested horizontal stackviews. Basically I just want to create a basic person details screen where will be Label on left and textfield on right which will go in one horizontal stackview and like this there will many horizontal stackviews nested in outer vertical stackview.
I am looking for such example on internet but seems most of the examples are in swift but I was hardly able to find some in c#.
Can someone please help.
Thanks,
Santosh
UIStackView leverages the power of Auto Layout and Size Classes to manage a stack of subviews, either horizontally or vertically, which dynamically responds to the orientation and screen size of the iOS device. You can learn about it through this documentation.
In your case, we can construct a vertical stack to place several horizontal stack:
UIStackView verticalStack = new UIStackView();
View.AddSubview(verticalStack);
verticalStack.Axis = UILayoutConstraintAxis.Vertical;
verticalStack.TranslatesAutoresizingMaskIntoConstraints = false;
// Use auto layout to embed this super vertical stack in the View. Also there's no need to set the height constraint, vertical stack will automatically adjust that depending on its content
verticalStack.LeadingAnchor.ConstraintEqualTo(View.LeadingAnchor).Active = true;
verticalStack.TopAnchor.ConstraintEqualTo(TopLayoutGuide.GetBottomAnchor()).Active = true;
verticalStack.TrailingAnchor.ConstraintEqualTo(View.TrailingAnchor).Active = true;
for (int i=0; i<10; i++)
{
// Here try to put some horizontal stack with Label on left and textfield on right in the father stack.
UIStackView horizontalStack = new UIStackView();
horizontalStack.Distribution = UIStackViewDistribution.EqualSpacing;
horizontalStack.Axis = UILayoutConstraintAxis.Horizontal;
// UIStackView should use AddArrangedSubview() to add subviews.
verticalStack.AddArrangedSubview(horizontalStack);
UILabel textLabel = new UILabel();
textLabel.Text = "text";
UITextField textField = new UITextField();
textField.Placeholder = "enter text";
horizontalStack.AddArrangedSubview(textLabel);
horizontalStack.AddArrangedSubview(textField);
}
But if every horizontal stack's subViews are almost the same style and layouts. Why not try to use UITableView? You just need to set the single cell's contents and layouts, then use it in the tableView. Moreover this control is reused and scrollable.
I want to implement a list in Android that contains some customized views.
My problem is that I want the the views will be put one after the other with a little overlap between them. like in the following schema:
I also want to control this overlap in such a way that when the user clicks on one of the items, they will move apart from each other.
I tried to extend ListView but it seems to be very obscured, any suggestions?
Edit:
This can be more clear:
I did it by setting the divider height to -50dp.
this is exactly what I want to achieve, but somehow it doesn't reflect on my app.
I managed to achieve this by using scroll view with a single relative layout as a child.
I then dynamically place the views by defining a rule and margin:
for (int i = 0; i < 30; i++) {
TextView tv = new TextView(context);
tv.setText("Text \n Text" + i);
tv.setBackgroundColor(i % 2 == 0 ? Color.RED : Color.GREEN);
RelativeLayout.LayoutParams lp = new RelativeLayout.LayoutParams(LayoutParams.MATCH_PARENT, LayoutParams.WRAP_CONTENT);
lp.addRule(RelativeLayout.ALIGN_PARENT_TOP);
lp.leftMargin = 0;
lp.topMargin = (i * 45);
rl.addView(tv, lp);
}
Later, you can control the positioning of the sub-views by changing their y value (for example: if you want to add animation).
This is the final result:
This can probably be achieved by using the Camera.setTranslate function. See Android: Vertical ListView with overlaped rows and Android: vertical 3d listview for similar questions (with solutions)
I have a FlowLayoutPanel and a UserControl.
I've added multiple usercontrols into the FlowLayoutPanel, and I'm trying to dock them to the top, so when I change the size of the FlowLayoutPanel the size (width) of the usercontrols changes accordingly.
You cannot dock anything inside a FlowLayoutPanel, it's simply ignored.
Check out the answer here apparently posted by the Microsoft team.
They say:
The FlowLayoutPanel relies on a largest control to effectively define the column/row within it. The code below set's the size of the first control to the width of the FLP to achieve a layout similar to what you want.
private void flowLayoutPanel1_Layout(object sender, LayoutEventArgs e)
{
flowLayoutPanel1.Controls[0].Dock = DockStyle.None;
for (int i = 1; i < flowLayoutPanel1.Controls.Count; i++)
{
flowLayoutPanel1.Controls[i].Dock = DockStyle.Top;
}
flowLayoutPanel1.Controls[0].Width = flowLayoutPanel1.DisplayRectangle.Width - flowLayoutPanel1.Controls[0].Margin.Horizontal;
}
Key thing is to use the Layout event.
This solution worked for me up to a point. Your UserControls have to have AutoSize turned off / stay a uniform size.
In my case I wanted AutoSize turned on so as to allow the UserControl to expand/contract vertically while filling the width of the FlowLayoutPanel.
I had to find a different solution. But the above might help you in your case.
I use LWUIT 1.4
1) In my Form there is a Container based on a BoxLayout ( Y axis ) , there are two Label's added to this container , and I want to create a titled Border to be placed into the container so it surrounds the two labels. I know to create a Border , but I do not know how to set a title to the Border with LWUIT 1.4 ! So how to set a title to a Border with LWUIT 1.4 ?
2) In my Form there is a Table based on the DefaultTableModel class whose getValueAt method is implemented with an enumeration of a recordstore , and I want that the rows of the Table are colored according to the index of the row : for example when the row index is odd then its background color should be white , and if the row index is pair then its background color should be gray. How to achieve that ?
3) Why do not the TableLayout.Constraint methods work ? I want to make two columns of a Table to have equal size , that is 50% of the Table total width for each column , but when I run the application then the first column is not equally sized with the second column when its data are not long enough ! So how to make the columns equally sized ?
Thank you very much indeed
1) There is a titled border in the trunk but I think it was added in 1.4.
You can draw something like this by overriding the Container paintBorder method (notice you will need sufficient component padding for the border to appear properly. This is the code from the SVN version, should work with very little changes (just change c to this):
Font f=c.getStyle().getFont();
int titleW=f.stringWidth(borderTitle);
int topPad=c.getStyle().getPadding(Component.TOP);
int topY=y+(topPad-thickness)/2;
if (c.isRTL()) {
g.fillRect(x+width-TITLE_MARGIN, topY, TITLE_MARGIN , thickness); //top (segment before the title)
g.fillRect(x, topY, width-(TITLE_MARGIN +titleW+TITLE_SPACE*2), thickness); //top (segment after the title)
g.drawString(borderTitle, x+width-(TITLE_MARGIN +titleW+TITLE_SPACE), y+(topPad-f.getHeight())/2);
} else {
g.fillRect(x, topY, TITLE_MARGIN , thickness); //top (segment before the title)
g.fillRect(x+TITLE_MARGIN +titleW+TITLE_SPACE*2, topY, width-(TITLE_MARGIN +titleW+TITLE_SPACE*2), thickness); //top (segment after the title)
g.drawString(borderTitle, x+TITLE_MARGIN+TITLE_SPACE, y+(topPad-f.getHeight())/2);
}
g.fillRect(x, y+height-thickness, width, thickness); //bottom
g.fillRect(x, topY, thickness, height); //left
g.fillRect(x+width-thickness, topY, thickness, height); //right
2) Derive table and override the method:
protected Component createCell(Object value, int row, int column, boolean editable)
call super.createCell() and set the UIID of the returned value to "OddRow","EvenRow" appropriately. Style in the resource editor or theme to anything you like.
3) I'm not aware of such an issue. If this happens on the current SVN you should file an issue in the projects issue tracker.
I downloaded the latest Resource Editor from your blog site , and I defined the background and border "selected" versions of the component TableCell , but the extra-rectangle is always shown in runtime when I click on a last column table cell ! I tried to call tableName.repaint() in the component focusGained() implemented method , because I registered it to a focuslistener , but the rectangle does not disappear.
I created a Dialog to show the selected row number and when the Dialog is shown when I click the third softbutton then the rectangle disappeared !!! Perhaps the focus is lost from the table cell !! And whenever I fire then I got the same row number as before ; so there is no row number error. So what code should I write , or what property should I edit in the Editor to get the same effect as of displaying the Dialog to make the rectangle disappear ?
I have a view with 4 text boxes and and a logo at the top - when the user is entering information the text pad covers up some of these controls, how can I make the view scroll so that this isn't an issue.
I have tried adding the view to a UIScrollView but that doesn't seem to do anything?
I've included a snippit below of how I've handled your situation. If I'm understanding you correctly, you do not wish to have a scrollable view, rather you want to the view to move in conjunction with switching to and from fields to alleviate and visual hindrances caused by the keyboard.
Goodluck!
private void ScrollTheView(bool movedUp, float scrollamount, UIView ViewToMove)
{
//To invoke a views built-in animation behaviour,
//you create an animation block and
//set the duration of the move...
//Set the display scroll animation and duration...
UIView.BeginAnimations(string.Empty, System.IntPtr.Zero);
UIView.SetAnimationDuration(0.15);
//Get Display size...
RectangleF frame = ViewToMove.Frame;
if (movedUp) {
//If the view should be moved up,
//subtract the keyboard height from the display...
frame.Y -= scrollamount;
}
else {
//If the view shouldn't be moved up, restore it
//by adding the keyboard height back to the original...
frame.Y += scrollamount;
}
//Assign the new frame to the view...
ViewToMove.Frame = frame;
//Tell the view that your all done with setting
//the animation parameters, and it should
//start the animation...
UIView.CommitAnimations();
}
You need to set more to the UIScrollView than just put subviews in it. Set up the ContentSize property properly for the complete size of the subviews so the scrollview knows about the larger content in it, than you can control the scrolling position, zoom factor and so on.
There are plenty of samples on iOS SDK, just check the UIScrollView documentation, transformation to Monotouch from ObjectiveC is straightforward or check blog post at http://blog.touch4apps.com/home/iphone-monotouch-development/monotouch-infinite-loop-image-scroll-view where I have a sample with images autoscrolled in UIScrollView.
something like this.
textBox.EditingDidBegin += delegate {
var offset = scrollView.contentOffset;
offset.Y -= 200;
scrollView.contentOffset = offset;
}