I am totally new to C# and starting with xamarin IOS code. i am basically from native app background.
i wanted simple app showing how to use swTableView controller in xamarin to show table as mention below.
Like :
ColumnNam ColumnNam ColumnNam ColumnNam
data1 data2 data3 data4
data5 data6 data7 data8
i tried search for the example but i did not find one...if any one already has information please let me know..
Thx in advance
There is no system control can perform effect like you need, you must customize one, I write a sample for you to reference:
In ViewController.cs:
public override void ViewDidLoad ()
{
this.Title = "testTalbeView";
this.View.Frame = UIScreen.MainScreen.Bounds;
this.View.BackgroundColor = UIColor.White;
UITableView tableView = new UITableView (UIScreen.MainScreen.Bounds);
tableView.SeparatorStyle = UITableViewCellSeparatorStyle.None;
tableView.Source = new MyTableSource ();
this.Add (tableView);
}
MyTableSource.cs:
public class MyTableSource : UITableViewSource
{
private string cellID = "MyCell";
private int columns = 2;
private List<string> dataList;
public MyTableSource ()
{
dataList = new List<string> ();
for (int i = 0; i < 10; i++) {
dataList.Add ("data " + i.ToString ());
}
}
#region implemented abstract members of UITableViewSource
public override nint RowsInSection (UITableView tableview, nint section)
{
return dataList.Count / columns + 1;
}
public override UITableViewCell GetCell (UITableView tableView, Foundation.NSIndexPath indexPath)
{
MyCell cell = tableView.DequeueReusableCell (cellID) as MyCell;
if (null == cell) {
cell = new MyCell (UITableViewCellStyle.Default, cellID);
cell.TextLabel.TextAlignment = UITextAlignment.Center;
}
int row = (int)indexPath.Row;
if (0 == row) {
cell.SetData ("Column0", "Column1");
}
else{
cell.SetData (dataList [(row-1) * columns], dataList [(row-1) * columns + 1]);
}
return cell;
}
#endregion
}
MyCell.cs:
public class MyCell : UITableViewCell
{
private UILabel lbC0;
private UILabel lbC1;
public MyCell (UITableViewCellStyle style,string cellID):base(style,cellID)
{
lbC0 = new UILabel ();
lbC0.TextAlignment = UITextAlignment.Center;
this.AddSubview (lbC0);
lbC1 = new UILabel ();
lbC1.TextAlignment = UITextAlignment.Center;
this.AddSubview (lbC1);
}
public void SetData(string str0,string str1)
{
lbC0.Text = str0;
lbC1.Text = str1;
}
public override void LayoutSubviews ()
{
nfloat lbWidth = this.Bounds.Width / 2;
nfloat lbHeight = this.Bounds.Height;
lbC0.Frame = new CoreGraphics.CGRect (0, 0, lbWidth, lbHeight);
lbC1.Frame = new CoreGraphics.CGRect (lbWidth, 0, lbWidth, lbHeight);
}
}
Then you can get the tableView like the picture:
Hope it can help you.
Related
I create a custom control for UILabel with custom Kern parameter.
[Register("CustomLabelView"), DesignTimeVisible(true)]
public class CustomLabelView : UILabel
{
private float _textLetterSpacing;
public CustomLabelView(IntPtr handle) : base(handle)
{
}
[Export("TextLetterSpacing"), Browsable(true)]
public float TextLetterSpacing
{
get => _textLetterSpacing;
set
{
_textLetterSpacing = value;
SetNeedsDisplay();
}
}
public CustomLabelView()
{
Initialize();
}
public override void AwakeFromNib()
{
// Called when loaded from xib or storyboard.
Initialize();
}
void Initialize()
{
NSRange range = new NSRange(0, Text.Length);
var attributes = AttributedText.GetCoreTextAttributes(0, out range);
var attributedTitle = new NSAttributedString(Text, new CTStringAttributes() { KerningAdjustment = TextLetterSpacing, ForegroundColor = TextColor.CGColor, UnderlineStyle = attributes.UnderlineStyle });
AttributedText = attributedTitle;
SetNeedsDisplay();
}
}
I bind text to this control with language converter
set.Bind(CustomLabelView)
.For(c => c.Text)
.To(vm => vm.TextSource)
.WithConversion("Language", "AgreementText");
and underline property doesn't apply for bound text. Also I tried AttributedText property instead of Text. No any changes.
My LinkerPleaseInclude file contains this lines
public void Include(UILabel label)
{
label.Text = label.Text + "";
label.AttributedText = new NSAttributedString(label.AttributedText.ToString() + "");
}
Any ideas how to sort it out?
I changed the UnderlineStyle property's value to one of the enumeration of CTUnderlineStyle and it works for me.
namespace CoreText
{
//
// Summary:
// Specifies the style of an underline ornament.
//
// Remarks:
// To be added.
public enum CTUnderlineStyle
{
None = 0,
Single = 1,
Thick = 2,
Double = 9
}
}
Here is my code:
void Initialize()
{
this.Text = "This is some formatted text";
NSRange range = new NSRange(0, Text.Length);
var attributes = AttributedText.GetCoreTextAttributes(0, out range);
var attributedTitle = new NSAttributedString(Text, new CTStringAttributes() { KerningAdjustment = TextLetterSpacing, ForegroundColor = TextColor.CGColor, UnderlineStyle = CTUnderlineStyle.Single });
AttributedText = attributedTitle;
SetNeedsDisplay();
}
The underline appears,is this you want?
I just put Initialize method into Draw for my CustomLabel.
Here is the solution:
public override void Draw(CGRect rect)
{
Initialize();
base.Draw(rect);
}
private void Initialize()
{
var attributes = AttributedText.GetCoreTextAttributes(0, out _);
AttributedText = new NSMutableAttributedString(Text,
new CTStringAttributes
{
KerningAdjustment = TextLetterSpacing, Font = attributes.Font,
UnderlineStyle = attributes.UnderlineStyle
});
}
After searching multiple blogs and videos I find that to implement the UITableView one can use MvxTableViewController, but what to use for NSTableView?
I do not find any tutorial, example that covers OSX binding TableView using MvvmCross. Any leads will be appreciated.
We don't have MvxTableViewController for macOS.
However, if you abstract from that, binding to a NSTableView is very similar to a UITableView on iOS.
private NSTableView _tableView;
public override void ViewDidLoad()
{
base.ViewDidLoad();
_tableView = new NSTableView();
// add constraints or size otherwise
var source = new MvxTableViewSource(_tableView);
_tableView.Source = source;
var set = this.CreateBindingSet<MyViewController, MyViewModel>();
set.Bind(source).For(v => v.ItemsSource).To(vm => vm.Items);
set.Apply();
}
This will bind the ViewModel Items to the ItemsSource. However, you will still need to specify what to bind in the cell. The simplest way to do this is to provide a TableColumn.
var column = new MvxTableColumn();
column.Identifier = "First";
column.BindingText = "Text Name";
column.HeaderCell = new NSCell("Example");
_tableView.AddColumn(column);
This will bind the Text property of the TableColumn to Name in the items provided in Items in the ViewModel.
If you need more than this you will need to subclass MvxTableViewSource and override GetOrCreateViewFor and in there provide your own subclass of MvxTableCellView where you do more. This could look something as follows.
public class MyCustomCell : MvxTableCellView
{
public MyCustomCell(IntPtr handle) : base(handle)
{
}
public MyCustomCell(string bindingText) : base(bindingText)
{
this.Frame = new CGRect(0, 0, 100, 50);
TextField = new NSTextField(new CGRect(50, 0, 100, 50))
{
Editable = false,
Bordered = false
};
ImageView = new NSImageView(new CGRect(0, 0, 50, 50));
AddSubview(TextField);
AddSubview(ImageView);
this.Initialize(bindingText);
}
private string _imageUrl;
public string ImageUrl
{
get => _imageUrl;
set
{
_imageUrl = value;
ImageService.Instance.LoadUrl(_imageUrl).Into(ImageView);
}
}
}
And the table source:
public class MyTableSource : MvxTableViewSource
{
private string _bindingText;
public MyTableSource(NSTableView tableView, string bindingText) : base(tableView)
{
_bindingText = bindingText;
}
public override NSView GetViewForItem(NSTableView tableView, NSTableColumn tableColumn, nint row)
{
if (ItemsSource == null)
return null;
var item = ItemsSource.ElementAt((int)row);
var view = new MyCustomCell(_bindingText);
if (view is IMvxDataConsumer bindable)
bindable.DataContext = item;
return view;
}
}
Then instead of using MvxTableViewSource in the first example, use your own MyTableSource instead:
var source = new MyTableViewSource(_tableView, "Text Name; ImageUrl Url");
_tableView.Source = source;
Where Name and Url are in the Item in the Items bound to the ItemsSource.
Xamarin Forms Custom Renderer iOS UICollectionView scrolling in both directions / horizontal – vertical scrolling
Intention: Implementation of an interactive Grid which scroll horizontally and vertically .
Problem:
The grid scrolls in both direction that much laggy. After scrolling with the finger you have to wait some seconds to see an reaction of the app.
We have implemented an UICollectionView in the same way in an native swift project, and it scrolls fluently. So I think the problem is rather the way of implementation than the rendering process.
With instruments I could find out that the CoreFoundation(RunLoops) cost the most of time(11s). So I guess its a threading problem.
Why I need to customize the UICollectionViewLayout to achieve horizontal scrolling? Because I need the ability to modify the width of single cells and other customizations too.
So the only way for scrolling in both direction I see, is to customize the UICollectionViewLayout.
Implementation:
Xamarin.Forms Project:
Create Custom Control (MyGrid) in Xamarin Forms, which extends from View Class:
public class MyGrid : View
{
public MyGrid() : base()
{
}
}
Use Custom Control ( MyGrid) in Xamarin Forms ContentPage):
<ContentPage
xmlns="http://xamarin.com/schemas/2014/forms"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
xmlns:local="clr-namespace:GridDemo"
x:Class="GridDemo.GridDemoPage">
<ContentPage.Content>
<local:MyGrid
VerticalOptions="FillAndExpand"
HorizontalOptions="FillAndExpand"
BackgroundColor="White"/>
</ContentPage.Content>
</ContentPage>
Xamarin.iOS Project:
Implement Custom Renderer for MyGrid Class in iOS project:
[assembly: ExportRenderer(typeof(MyGrid), typeof(MyGridRenderer))]
namespace GridDemo.iOS
{
public class MyGridRenderer : ViewRenderer<MyGrid, IOSGrid>
{
public MyGridRenderer()
{
}
protected override void OnElementChanged(ElementChangedEventArgs<MyGrid> e)
{
base.OnElementChanged(e);
if (Control == null)
{
MyGrid myGrid = (MyGrid)e.NewElement;
List<List<string>> values = myGrid.Source;
var list = new List<CustomIOSGridCell>();
var column = 0;
var row = 0;
var maxColumnLength = new int[myGrid.ColumnCount];
for (int i = 0; i < myGrid.RowCount; i++)
{
for (int j = 0; j < myGrid.ColumnCount; j++)
{
var array = values[i];
var stringLength = array.Aggregate("", (max, cur) => max.Length > cur.Length ? max : cur);
if (stringLength.Length > maxColumnLength[j])
{
maxColumnLength[j] = stringLength.Length;
}
list.Add(new CustomIOSGridCell(values[i][j));
}
}
var grid = new IOSGrid(this.Bounds, new IOSGridLayout(myGrid.ColumnCount, myGrid.RowCount, maxColumnLength));
grid.AddValues(list, myGrid.ColumnCount, myGrid.RowCount);
SetNativeControl(grid);
}
if (e.OldElement != null)
{
// Unsubscribe from event handlers and cleanup any resources
}
if (e.NewElement != null)
{
// Configure the control and subscribe to event handlers
}
}
}
}
Implement native control(iOSGrid), the corresponding Control to Custom Xamarin Forms Control (MyGrid):
public class IOSGrid : UICollectionView
{
List<CustomIOSGridCell> values = new List<CustomIOSGridCell>();
public IOSGrid(CGRect frame, IOSGridLayout collectionViewLayout) : base(frame, collectionViewLayout)
{
this.RegisterClassForCell(typeof(CustomCollectionViewCell), CustomCollectionViewCell.CellID);
BackgroundColor = UIColor.Blue;
}
public void AddValues(List<CustomIOSGridCell> values, int columncount, int rowCount)
{
this.values.AddRange(values);
this.Source = new CustomCollectionSource(this.values, rowCount, columncount);
this.ReloadData();
}
}
Implement Custom UICollectionViewLayout for IOSGrid(UICollectionView) to provide horizontal AND vertical scrolling
public class IOSGridLayout : UICollectionViewLayout
{
private Timer timer;
enum Direction { up, down ,leftRight, none }
int columnsCount = 0;
int rowCount = 0;
CoreGraphics.CGSize[] itemsSize = null;
CoreGraphics.CGSize contentSize = CoreGraphics.CGSize.Empty;
int[] maxLength;
public CGRect currentRect = CGRect.Empty;
CGPoint currentCorner = new CGPoint(-1, -1);
UICollectionViewLayoutAttributes[,] itemAttributes;
public IOSGridLayout(int columnsCount, int rowCount, int[] maxLength)
{
this.columnsCount = columnsCount;
this.rowCount = rowCount;
this.maxLength = maxLength;
itemAttributes = new UICollectionViewLayoutAttributes[rowCount, columnsCount];
}
public override void PrepareLayout()
{
if (CollectionView == null) return;
var collectionView = CollectionView;
if (collectionView.NumberOfSections() == 0) return;
if (itemAttributes.Length != collectionView.NumberOfSections())
{
generateItemAttributes(collectionView);
return;
}
for (int section = 0; section < collectionView.NumberOfSections(); section++)
{
for (int item = 0; item < collectionView.NumberOfItemsInSection(section); item++)
{
if (section != 0 && item != 0)
{
continue;
}
var attributes = LayoutAttributesForItem(NSIndexPath.FromItemSection(item, section)); }
}
}
public override CGSize CollectionViewContentSize
{
get { return contentSize; }
}
public override UICollectionViewLayoutAttributes LayoutAttributesForItem(NSIndexPath indexPath)
{
return itemAttributes[indexPath.Section, indexPath.Row];
}
public override UICollectionViewLayoutAttributes[] LayoutAttributesForElementsInRect(CGRect rect)
{
var attributes = new List<UICollectionViewLayoutAttributes>();
// calculate actual shown attributes
return attributes.ToArray();
}
public override bool ShouldInvalidateLayoutForBoundsChange(CGRect newBounds)
{
return true;
}
private void generateItemAttributes(UICollectionView collectionView)
{
if (itemsSize?.Length != columnsCount)
{
CalculateItemSizes();
}
var column = 0;
nfloat xOffset = 0;
nfloat yOffset = 0;
nfloat contentWidth = 0;
itemAttributes = new UICollectionViewLayoutAttributes[rowCount, columnsCount];
var se = collectionView.NumberOfSections();
for (int section = 0; section < rowCount; section++)
{
var sectionAttributes = new UICollectionViewLayoutAttributes[columnsCount];
for (int index = 0; index < columnsCount; index++)
{
var itemSize = itemsSize[index];
var indexPath = NSIndexPath.FromItemSection(index, section);
var attributes = UIKit.UICollectionViewLayoutAttributes.CreateForCell(indexPath);
attributes.Frame = new CGRect(xOffset, yOffset, itemSize.Width, itemSize.Height).Integral();
if (section == 0)
{
var frame = attributes.Frame;
frame.Y = collectionView.ContentOffset.Y;
attributes.Frame = frame;
}
if (index == 0)
{
var frame = attributes.Frame;
frame.X = collectionView.ContentOffset.X;
attributes.Frame = frame;
}
sectionAttributes[index]=attributes;
xOffset += itemSize.Width;
column += 1;
if (column == columnsCount)
{
if (xOffset > contentWidth)
{
contentWidth = xOffset;
}
column = 0;
xOffset = 0;
yOffset += itemSize.Height;
}
}
for (int i = 0; i < sectionAttributes.Length; i++)
{
itemAttributes[section, i] = sectionAttributes[i];
}
}
var attr = itemAttributes[rowCount-1,columnsCount-1];
if (attr != null)
{
contentSize = new CGSize(contentWidth, attr.Frame.GetMaxY());
}
}
private void CalculateItemSizes()
{
itemsSize = new CGSize[columnsCount];
for (int index = 0; index < columnsCount; index++)
{
itemsSize[index] = SizeForItemWithColumnIndex(index);
}
}
private CGSize SizeForItemWithColumnIndex(int index)
{
// CollectionView.CellForItem()
string text = "";
for (int i = 0; i < maxLength[index]; i++)
{
text += "M";
}
NSString ma = new NSString(text);
var size = ma.StringSize(UIFont.SystemFontOfSize(14));
size.Height = 35;
return size;
}
}
Implement Custom UICollectionViewSource for IOSGrid(UICollectionView):
public class CustomCollectionSource : UICollectionViewSource
{
private readonly List<CustomIOSGridCell> values = new List<CustomIOSGridCell>();
private readonly int rowCount = 0;
private readonly int columnCount = 0;
public CustomCollectionSource(List<CustomIOSGridCell> values, int rowCount, int columnCount)
{
this.values = values;
this.rowCount = rowCount;
this.columnCount = columnCount;
}
public override nint GetItemsCount(UICollectionView collectionView, nint section)
{
return rowCount;
}
public override nint NumberOfSections(UICollectionView collectionView)
{
return columnCount;
}
public override UICollectionViewCell GetCell(UICollectionView collectionView, NSIndexPath indexPath)
{
var cell = (CustomCollectionViewCell)collectionView.DequeueReusableCell(CustomCollectionViewCell.CellID, indexPath);
cell.UpdateCell(values[indexPath.Row].Text);
return cell;
}
}
Implement Custom UICollectionViewCell for IOSGrid(UICollectionView):
public class CustomCollectionViewCell : UICollectionViewCell
{
public UILabel mainLabel;
public static NSString CellID = new NSString("customCollectionCell");
[Export("initWithFrame:")]
public CustomCollectionViewCell(CGRect frame) : base(frame)
{
// Default
ContentView.Layer.BorderColor = UIColor.Blue.CGColor;
ContentView.Layer.BorderWidth = 1.0f;
ContentView.Layer.BackgroundColor = UIColor.White.CGColor;
mainLabel = new UILabel();
ContentView.AddSubview( mainLabel );
}
public void UpdateCell(string text)
{
mainLabel.Text = text;
mainLabel.Frame = new CGRect(5, 5, ContentView.Bounds.Width, 26);
}
}
I want to binding a variable to a label which as a children in a grid.
the variable changed with a timer event.pls check my code help me found out where i am wrong.I can see the label init value is 0,but it won't update when the variable do.
public class DevicePage : ContentPage
{
IDevice device;
Label testLb = new Label();
System.Timers.Timer testtimer;
Grid gridView;
byte testt { get; set; } = 0;
GetSendData communicate;
private byte _maintext;
public byte MainText
{
get
{
return _maintext;
}
set
{
_maintext = value;
OnPropertyChanged();
}
}
public DevicePage(IDevice currDevice)
{
device = currDevice;
this.Title = "Status";
testtimer = new System.Timers.Timer();
testtimer.Interval = 1000;
testtimer.Elapsed += OnTimedEvent;
testtimer.Enabled = true;
gridView = new Grid();
testLb.Text = testt.ToString();
testLb.SetBinding(Label.TextProperty, ".");
testLb.BindingContext = MainText;
gridView.Children.Add(testLb, 0, 0);
this.Content = gridView;
}
private void OnTimedEvent(object sender, System.Timers.ElapsedEventArgs e)
{
MainText += 1;
}
after I implement INotifyPropertyChanged,testLb won't update either.But I change testLb.SetBinding(Label.TextProperty, "."); testLb.BindingContext = MainText; to testLb.SetBinding(Label.TextProperty, "MainText"); testLb.BindingContext = this; It works!
I've this...
public partial class ViewController : UIViewController
{
UIView[] seqPages;
...
}
private void loadApp()
{
int seqCount=5;
for (int i = 0; i < seqCount; i++)
{
seqPages[i] = new UIView()
{
Frame = new CoreGraphics.CGRect(0, 0, vpWidth, vpHeight)
};
string s = app.sequence[i];
var img = UIImage.FromFile("pages/myimg.png");
UIImageView imgView = new UIImageView(new CoreGraphics.CGRect(0, 0, 1000, 1000));
imgView.Image = img;
imgView.ContentMode = UIViewContentMode.ScaleAspectFit;
seqPages[i].Add(imgView);
mainContainer.Add(seqPages[i]);
}
}
private void removePage(index){
//Remove the children of seqPages UIVIew array
}
So,on the comment "//Remove the children of seqPages UIVIew array" I need something like : seqPages[index].removeAllChildren();
I was unable to find on Google how to archive this. Can anybody help me ?
UIView has a RemoveFromSuperview method that will remove it from its "parent":
foreach (var view in this.View.Subviews)
{
view.RemoveFromSuperview();
}