I am trying to scroll to bottom of layout. I've got this piece of code, but it's not working
ScrollView scrollView = view.FindViewById<ScrollView>(Resource.Id.scrollViewHelper);
scrollView.FullScroll(FocusSearchDirection.Down);
A simple way is to create an Action-based runnable, passing the Action as a parameter to the runnable .
You can refer to the following code:
scrollView = FindViewById<ScrollView>(Resource.Id.scrollView1);
var runnable = new MyRunnable(async () =>
{
// Do whatever you need to do, including capturing of local vars, app/activity context, etc.
await Task.Delay(500);
scrollView.FullScroll(FocusSearchDirection.Down);
});
runnable.Run();
Code of class MyRunnable
public class MyRunnable : Java.Lang.Object, Java.Lang.IRunnable
{
readonly WeakReference<Action> actionRef;
public MyRunnable(Action action)
{
actionRef = new WeakReference<Action>(action);
}
public void Run()
{
actionRef.TryGetTarget(out Action action);
action?.Invoke();
}
}
Related
After implementing nested layouts i faced the problem with rendering component containing grid. The analysis shows that is present in html but it has display-block attributes and the grid is never visible.
I read the similar question (Vaadin 14 - Grid not Displaying/Populating When Used in Nested Layout) but the suggestions listed there brought me no result.
Here comes my code:
MainLayout.kt:
#Theme(value = Material::class, variant = Material.DARK)
class MainLayout : Composite<Div>(), RouterLayout {
//Component to delegate content through.
private val mainContent: Div = Div()
private val layout = VerticalLayout(
Span("from MainLayout top"),
mainContent,
Span("from MainLayout bottom"))
override fun showRouterLayoutContent(hasElement: HasElement) {
Objects.requireNonNull(hasElement)
Objects.requireNonNull(hasElement.element)
mainContent.removeAll()
mainContent.element.appendChild(hasElement.element)
}
init {
content.add(layout)
}
}
LayoutWithMenuBar.kt:
#ParentLayout(value = MainLayout::class)
class LayoutWithMenuBar : Composite<Div>(), RouterLayout {
private val mainContent: Div = Div()
private val menuBar = HorizontalLayout(
RouterLink("Home", MainView::class.java),
RouterLink("Tprojects", TProjectDashboard::class.java),
RouterLink("ViewA", ViewA::class.java),
RouterLink("ViewB", ViewB::class.java))
private val root = VerticalLayout(menuBar, mainContent)
override fun showRouterLayoutContent(hasElement: HasElement) {
Objects.requireNonNull(hasElement)
Objects.requireNonNull(hasElement.element)
mainContent.removeAll()
mainContent.element.appendChild(hasElement.element)
}
init {
content.add(root)
}
}
and a component containing grid - TProjectDashboard:
#Route("dashboard/tproject", layout = LayoutWithMenuBar::class)
class TProjectDashboard(#Autowired val tprojectService: TProjectService): VerticalLayout() {
var tprojectGrid = Grid<TProject>(TProject::class.java)
init {
//tprojectGrid
tprojectGrid.setColumns(
TProject::tprojectUuid.name,
TProject::tprojectClass.name,
TProject::tprojectState.name,
TProject::tentityState.name,
TProject::size.name)
tprojectGrid.setItems(tprojectService.findAll())
tprojectGrid.setSizeFull()
tprojectGrid.setWidthFull()
tprojectGrid.setHeightFull()
add(tprojectGrid)
setSizeFull()
setHeightFull()
setWidthFull()
}
}
The same result i have when changing TProjectDashboard parent from VerticalLayout to Composite.
The nested layouts approach works well for simple components like Span and if i remove layout reference from #Route annotation i will see my grid.
Here is the screen how it looks like now:
enter image description here
Would appreciate for any hints or solutions.
Thanks in advance.
It's probably a sizing issue that unfortunately happens too often. I would start with calling setSizeFull() on the mainContent div. If that doesn't help, go through the elements in the browser devtools and try to see where the size disappears, e.g. what is the first element that has 0 width or height.
Edit: Setting setSizeFull() on all components works. I would simplify your layouts slightly, though, by changing the composites to be of type VerticalLayout. Then you can get rid of a lot of the setSizeFull() calls.
The code below is in Java as I don't have Kotlin set up, you can call getContent().setSizeFull() in MainLayout if you want it to take the full height of the page.
MainLayout
#Theme(value = Material.class, variant = Material.DARK)
public class MainLayout extends Composite<VerticalLayout> implements RouterLayout {
//Component to delegate content through.
private Div mainContent = new Div();
public MainLayout() {
getContent().add(
new Span("from MainLayout top"),
mainContent,
new Span("from MainLayout bottom"));
mainContent.setSizeFull();
}
#Override
public void showRouterLayoutContent(HasElement hasElement) {
Objects.requireNonNull(hasElement);
Objects.requireNonNull(hasElement.getElement());
mainContent.removeAll();
mainContent.getElement().appendChild(hasElement.getElement());
}
}
LayoutWithMenuBar
#ParentLayout(value = MainLayout.class)
public class LayoutWithMenuBar extends Composite<VerticalLayout> implements RouterLayout {
private Div mainContent = new Div();
private HorizontalLayout menuBar = new HorizontalLayout(
new RouterLink("Tprojects", TProjectDashboard.class));
public LayoutWithMenuBar() {
getContent().add(menuBar, mainContent);
mainContent.setSizeFull();
}
#Override
public void showRouterLayoutContent(HasElement hasElement) {
Objects.requireNonNull(hasElement);
Objects.requireNonNull(hasElement.getElement());
mainContent.removeAll();
mainContent.getElement().appendChild(hasElement.getElement());
}
}
TProjectDashboard
#Route(value = "dashboard/tproject", layout = LayoutWithMenuBar.class)
public class TProjectDashboard extends VerticalLayout {
private Grid<TProject> tprojectGrid = new Grid<>(TProject.class);
public TProjectDashboard() {
tprojectGrid.setItems(
new TProject("Erik", "Software Engineer"),
new TProject("Fia", "Kindergarden teacher"),
new TProject("Jack", "All trades")
);
add(tprojectGrid);
}
}
I have a small app, that does read QR-Codes for a login and alternatively offers the possibility to hand-type the code and login.
The app starts and heads directly to the login (View). When I try to scan a qr code that does not work - the delegate is never called/the event never raised.
I adapted the approach from Larry OBrien http://www.knowing.net/index.php/2013/10/09/natively-recognize-barcodesqr-codes-in-ios-7-with-xamarin-ios/
And created my own ScannerView class for that use:
public sealed partial class ScannerView : UIView
{
private readonly AVCaptureVideoPreviewLayer _layer;
public AVCaptureSession Session { get; }
private readonly AVCaptureMetadataOutput _metadataOutput;
public event EventHandler<AVMetadataMachineReadableCodeObject> MetadataFound = delegate { };
public ScannerView (IntPtr handle) : base (handle)
{
Session = new AVCaptureSession();
var camera = AVCaptureDevice.DefaultDeviceWithMediaType(AVMediaType.Video);
var input = AVCaptureDeviceInput.FromDevice(camera);
Session.AddInput(input);
//Add the metadata output channel
_metadataOutput = new AVCaptureMetadataOutput {RectOfInterest = Bounds};
var metadataDelegate = new MetadataOutputDelegate();
var dispatchQueue = new DispatchQueue("scannerQueue");
_metadataOutput.SetDelegate(metadataDelegate, dispatchQueue);
Session.AddOutput(_metadataOutput);
_layer = new AVCaptureVideoPreviewLayer(Session)
{
MasksToBounds = true,
VideoGravity = AVLayerVideoGravity.ResizeAspectFill,
Frame = Bounds
};
Layer.AddSublayer(_layer);
// Hand event over to subscriber
metadataDelegate.MetadataFound += (s, e) => MetadataFound(s, e);
}
public override void LayoutSubviews()
{
base.LayoutSubviews();
_layer.Frame = Bounds;
_metadataOutput.RectOfInterest = Bounds;
}
public void SetMetadataType(AVMetadataObjectType type)
{
//Confusing! *After* adding to session, tell output what to recognize...
_metadataOutput.MetadataObjectTypes = type;
}
}
And in my LoginView I do the following:
public override void ViewWillAppear(bool animated)
{
base.ViewWillAppear(animated);
// Manipulate navigation stack
NavigationController.SetViewControllers(
NavigationController.ViewControllers.Where(
viewController => viewController is LoginView).ToArray(), false);
ScannerView.MetadataFound += (s, e) =>
{
Console.WriteLine($"Found: [{e.Type.ToString()}] {e.StringValue}");
LoginViewModel.BarCode = e.StringValue;
if (LoginViewModel.DoneCommand.CanExecute())
{
ScannerView.Session.StopRunning();
LoginViewModel.DoneCommand.Execute();
}
};
}
public override void ViewDidAppear(bool animated)
{
base.ViewDidAppear(animated);
ScannerView.Session.StartRunning();
ScannerView.SetMetadataType(AVMetadataObjectType.QRCode | AVMetadataObjectType.EAN13Code);
}
Funny thing is, that this works once I logged in with the manual input and logged out again, so I'm on the same screen again (possibly not the same but a new instance of it as the GC may destroy the view as it is removed from the navigation stack?)
I have put the scannerview as a subview on the LoginView in the storyboard. For navigation I use MVVMCross. (just for info)
So: What am I doing wrong? What do I need to do to make it work on the first load? (I got it to do that once - with the same code... maybe it is a timing issue?)
Obviously this is a timing issue.
I solved it by adding a "Tap to scan" paradigm.
When tapping I execute the following code:
public override void TouchesBegan(NSSet touches, UIEvent evt)
{
base.TouchesBegan(touches, evt);
Console.WriteLine($"Current types to scan: {this.MetadataOutput.MetadataObjectTypes}");
this.SetMetadataType(this.MetadataObjectType);
Console.WriteLine($"New types to scan: {this.MetadataOutput.MetadataObjectTypes}");
}
public void SetMetadataType(AVMetadataObjectType type)
{
//Confusing! *After* adding to session, tell output what to recognize...
this.Session.BeginConfiguration();
this.MetadataOutput.MetadataObjectTypes = type;
this.Session.CommitConfiguration();
}
Where MetadataObjectType is set to the codes we're looking for before.
And that solves the problem - the scanning now works every time.
I think the magic part is the Begin- and CommitConfiguration call, as this also works, if I do not use the touch to scan paradigm.
I am developing an app for iOS using MvvmCross. On one of my Views I have some basic report data that is displayed in a tableview.
When the table row is touched a new view containing a detail report is displayed by making the call to ShowViewModel passing some parameters in a Dictionary. This works fine.
When the user swipes left or right the app needs to show the detail report for the next or previous item in the original list. I am doing this by updating some parameters and calling ShowViewModel again. The logic behind this is all working fine.
My problem; ShowViewModel animates the new view coming in from the right. This is perfect when the user has swiped left. However when swiping right it seems counter intuitive. How can I make ShowViewModel animate or transition in from the left side?
if you look to the MvvmCross source code here you see how the default behavior is showing the ViewControllers
You need to change that by doing something like the following:
How to change the Push and Pop animations in a navigation based app
for that, one idea is to have a custom view presenter and catch navigation to that particular view-model (override Show(IMvxTouchView view) )
or, maybe derive from UINavigationController, set it to MvvmCross to use it (look to the MvxSetup), and on some events change transition to that particular view
similar to this question
How to specify view transitions on iPhone
This is the solution I was able to come up with following the helpful pointers in the answer from Andrei N. In the end I opted for a TransitionFlipFromRight and TransitionFlipFromLeft when scrolling between detail reports. Hopefully it is useful to somebody else.
I already had a presenter class that was inherited from MvxModalSupportTouchViewPresenter
public class BedfordViewPresenter : MvxModalSupportTouchViewPresenter
Within this class I added a property of MvxPresentationHint.
private MvxPresentationHint _presentationHint;
In the override of method ChangePresentation the above property is used to store the passed in parameter
public override void ChangePresentation (MvxPresentationHint hint)
{
_presentationHint = hint;
base.ChangePresentation (hint);
}
Two new MvxPresentationHint class were declared (see later)
In the presenter class the Show method was overridden
public override void Show(IMvxTouchView view)
{
if (_presentationHint is FlipFromRightPresentationHint) {
var viewController = view as UIViewController;
MasterNavigationController.PushControllerWithTransition (viewController, UIViewAnimationOptions.TransitionFlipFromRight);
}
else
if (_presentationHint is FlipFromLeftPresentationHint) {
var viewController = view as UIViewController;
MasterNavigationController.PushControllerWithTransition (viewController, UIViewAnimationOptions.TransitionFlipFromLeft);
}
else {
base.Show (view);
}
_presentationHint = null;
}
A new class that provides extensions to a UINavigationController was created with the method PushControllerWithTransition
public static class UINavigationControllerExtensions
{
public static void PushControllerWithTransition(this UINavigationController
target, UIViewController controllerToPush,
UIViewAnimationOptions transition)
{
UIView.Transition(target.View, 0.75d, transition, delegate() {
target.PushViewController(controllerToPush, false);
}, null);
}
}
All that needs to be defined now are the two new MvxPresentationHint class derivations. These belong in your Core class library project rather than the iOS application project.
public class FlipFromLeftPresentationHint : MvxPresentationHint
{
public FlipFromLeftPresentationHint ()
{
}
}
and
public class FlipFromRightPresentationHint: MvxPresentationHint
{
public FlipFromRightPresentationHint ()
{
}
}
I hope this is a help to someone else trying to do something similar
Share my solution for android:
On view:
public override View OnCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState)
{
var view = base.OnCreateView(inflater, container, savedInstanceState);
var layout = view.FindViewById<LinearLayout>(Resource.Id.swippeable);
var swipeListener = new SwipeListener(this.Activity);
swipeListener.OnSwipeLeft += (sender, e) => this.ViewModel.LeftCommand?.Execute(); //Here use command into view model
swipeListener.OnSwipeRight += (sender, e) => this.ViewModel.RightCommand?.Execute();
layout.SetOnTouchListener(swipeListener);
return view;
}
Gesture listener:
public class SwipeListener : SimpleOnGestureListener, View.IOnTouchListener
{
private const int SWIPE_THRESHOLD = 100;
private const int SWIPE_VELOCITY_THRESHOLD = 100;
private readonly GestureDetector gestureDetector;
public SwipeListener(Context ctx)
{
this.gestureDetector = new GestureDetector(ctx, this);
}
public Boolean OnTouch(View v, MotionEvent e)
{
return this.gestureDetector.OnTouchEvent(e);
}
public event EventHandler OnSwipeRight;
public event EventHandler OnSwipeLeft;
public event EventHandler OnSwipeTop;
public event EventHandler OnSwipeBottom;
public override Boolean OnDown(MotionEvent e)
{
return true;
}
public override Boolean OnFling(MotionEvent e1, MotionEvent e2, float velocityX, float velocityY)
{
Boolean result = false;
float diffY = e2.GetY() - e1.GetY();
float diffX = e2.GetX() - e1.GetX();
if (Math.Abs(diffX) > Math.Abs(diffY))
{
if (Math.Abs(diffX) > SWIPE_THRESHOLD && Math.Abs(velocityX) > SWIPE_VELOCITY_THRESHOLD)
{
if (diffX > 0)
{
SwipeRight();
}
else
{
SwipeLeft();
}
result = true;
}
}
else if (Math.Abs(diffY) > SWIPE_THRESHOLD && Math.Abs(velocityY) > SWIPE_VELOCITY_THRESHOLD)
{
if (diffY > 0)
{
SwipeBottom();
}
else
{
SwipeTop();
}
result = true;
}
return result;
}
public void SwipeRight()
{
this.OnSwipeRight?.Invoke(this, EventArgs.Empty);
}
public void SwipeLeft()
{
this.OnSwipeLeft?.Invoke(this, EventArgs.Empty);
}
public void SwipeTop()
{
this.OnSwipeTop?.Invoke(this, EventArgs.Empty);
}
public void SwipeBottom()
{
this.OnSwipeBottom?.Invoke(this, EventArgs.Empty);
}
}
The card.io component (http://components.xamarin.com/view/cardioios) has a fallback screen that has a Cancel and a Done button on them.
Neither of which actually do anything. I assume it is up to me to subscribe to and event, however, there is no event to subscribe to.
Here is the code:
var paymentDelegate = new PaymentViewControllerDelegate();
var paymentViewController = new Card.IO.PaymentViewController(paymentDelegate);
paymentDelegate.OnScanCompleted += (viewController, cardInfo) =>
{
viewController.DismissViewController(true, null);
if (cardInfo == null)
{
}
else
{
new UIAlertView("Card Scanned!", cardInfo.CardNumber, null, "OK", null).Show();
}
};
paymentViewController.AppToken = "app-token";
// Display the card.io interface
base.PresentViewController(paymentViewController, true, () => { });
There is a method on the PaymentViewControllerDelegate, but I can't figure out what to do with it:
public override void UserDidCancel(PaymentViewController paymentViewController);
public override void UserDidProvideCreditCardInfo(CreditCardInfo cardInfo, PaymentViewController paymentViewController);
I guess the problem is that the Component doesn't expose any events for the Fallback View.
You need to subclass PaymentViewControllerDelegate:
public class MyPaymentDelegate : PaymentViewControllerDelegate
{
public MyPaymentDelegate ()
{
}
public override void UserDidCancel (PaymentViewController paymentViewController)
{
// Implement on-cancel logic here...
base.UserDidCancel (paymentViewController);
}
public override void UserDidProvideCreditCardInfo (CreditCardInfo cardInfo, PaymentViewController paymentViewController)
{
// Implement logic for credit card info provided here...
base.UserDidProvideCreditCardInfo (cardInfo, paymentViewController);
}
}
And then provide an instance of this class into the constructor for Card.IO.PaymentViewController:
var paymentDelegate = new MyPaymentDelegate();
var paymentViewController = new Card.IO.PaymentViewController(paymentDelegate);
So, I figured this out by looking at the working sample application and comparing it to what I had done.
All I had to do was widen the scope of the paymentDelegate and paymentViewController variables.
If you look at the sample, you really just need to subscribe to the OnScanCompleted event which is called in both cases of UserDidCancel (where cardInfo will be null), and UserDidProvideCreditCardInfo (where it will not be null).
In fact, this is the code for the binding, so you can see the Event was made as a 'helper' to make it so you didn't have to make your own delegate implementation:
namespace Card.IO
{
public partial class PaymentViewControllerDelegate : BasePaymentViewControllerDelegate
{
public delegate void ScanCompleted(PaymentViewController viewController, CreditCardInfo cardInfo);
public event ScanCompleted OnScanCompleted;
public override void UserDidCancel (PaymentViewController paymentViewController)
{
var evt = OnScanCompleted;
if (evt != null)
evt(paymentViewController, null);
}
public override void UserDidProvideCreditCardInfo (CreditCardInfo cardInfo, PaymentViewController paymentViewController)
{
var evt = OnScanCompleted;
if (evt != null)
evt(paymentViewController, cardInfo);
}
}
}
If you still really want to implement the delegate yourself, subclass BasePaymentViewController instead, however I don't think you really need to make your own subclass of it...
Hopefully that helps!
I would like to know if there is a binding mechanism from a viewmodel property that provides focus (the cursor to blink or something to indicate that the textedit has focus) in a specific edittext of my choice.
This is a general Mvvm question - like MVVM Focus To Textbox
Just as in the general question, in MvvmCross you could do this in some code behind in your View. For example, you could create a helper class like:
public class Helper
{
private Activity _a;
public Helper(Activity a)
{
_a = a;
}
// TODO - this should probably be a ViewModel-specific enum rather than a string
private string _focussedName;
public string FocussedName
{
get { return _focussedName; }
set
{
_focussedName = value;
var mapped = MapFocussedNameToControlName(_focussedName);
var res = _a.Resources.GetIdentifier(mapped, "id", _a.PackageName);
var view = _a.FindViewById(res);
view.RequestFocus();
}
}
private string MapFocussedNameToControlName(string value)
{
// TODO - your mapping here...
return value;
}
}
This could then be bound in the View and in OnCreate as:
private Helper _helper;
protected override void OnCreate (Bundle bundle)
{
base.OnCreate (bundle);
// Set our view from the "main" layout resource
SetContentView (Resource.Layout.main);
_helper = new Helper(this);
this.CreateBinding(_helper)
.For(h => h.FocussedName)
.To<MyViewModel>(x => x.FocusName)
.OneWay()
.Apply();
}
This code not tested - but should roughly work.