This column will airing you through a simple aboriginal activity in Xamarin for Android development. Xamarin is ideal for cross-platform development and decidedly acceptable to use!
In a antecedent post, we abstruse how to set up Xamarin and Visual Studio for Android development and covered one or two basics of how it works. We additionally looked at some basal cipher to acquiesce us to calculation “clicks” on the screen. Analysis it out if you’re attractive for a abrupt addition to the IDE and what it can do, afresh acknowledge us here.
In this post, we’ll dive a little added and actualize a actual basal app. This will be a simple algebraic game, but in ambience it up we’ll apprentice how to do a few things in Xamarin like handle variables, use graphics, acceptation classes, and analysis our bold on a concrete device. These abilities will artlessly acquiesce you to advance added circuitous apps in Xamarin bottomward the track.
To get started, amount up Visual Studio, bang File > New Project and baddest “Android” on the larboard beneath Installed > Visual C#. If you don’t see it there, chase these instructions.
Pick “Blank App (Android)” on the appropriate and you’re acceptable to go.
Once you’re presented with your aboriginal project, you’ll acquisition your book bureaucracy in a window alleged “Solution Explorer.” In here, locate MainActivity.cs and bifold bang on it to accessible up the cipher for your capital activity. Meanwhile, you’ll be able to acquisition the ability book beneath Resources > blueprint > Main.axml. As with Android Studio development, the blueprint book handles the attending of your app and position of the views, while the cs book takes affliction of the argumentation and the behavior.
When you bang on the axml file, you’ll see a examination of your app accessible up in a Designer. This will let you annoyance and bead alone elements into your architecture and move them around. Notice the toolbox advantage hidden on the left. Bang that to aggrandize a card absolute TextViews, ImageViews, and added for accessible access.
Let’s alpha out by giving our bold a air-conditioned logo. To do that, aboriginal actualize your logo about you wish. Afresh right-click on the Resources > drawable folder in the band-aid charlatan and baddest “Open Binder in Book Explorer.” You can afresh annoyance and bead your angel in.
See Also: hack lineWhen you acknowledgment to Visual Studio, you’ll charge to add that book to your project, which is an added footfall on top of the action in Android Studio. Right-click on the binder again, afresh go to Add > Existing Item and cross to the bright in the charlatan that ancestor up.
Now you can add the angel actualization to your Main.axml file. Either annoyance the Angel Actualization in the artist or add it in calligraphy aloof as you commonly would. You’ll additionally appetite to ascertain the angel that will actualization actuality and a bit of the layout:
We’ll be alive with a beeline blueprint by default, which apparel our purposes aloof fine. If you appetite to, you can analysis the actualization in the emulator.
Now that’s in order, let’s add the blow of the UI. We’re activity to appetite to actualization our maths claiming in a argument view, afresh accommodate about for the user to access their acknowledgment and actualize a button for them to abide it. I’ve additionally added argument angle at the basal to actualization the cardinal of appropriate and amiss answers. I acclimated a bare argument actualization with a weight of “1” and gave the two adapt texts a weight of “0.” The weight aspect tells Android which items angry for amplitude on the awning get priority. Because the acme of the bare actualization is “match parent,” it will cool to ample all accessible amplitude and advance the two account fields bottomward the bottom. If you’re accustomed with Android Studio, affairs are you’ll acquire done things like this in the past. Otherwise, aloof archetype and adhesive this code:
Be abiding to use input_type = “number” on your adapt argument to acquire alone after responses.
You won’t be able to add new angle while the app is running, so bang the stop button abutting to the comedy figure to disconnect. I aloof adored you hours of frustration; you are welcome. If you appetite to added adapt the attending of your app, bang the paintbrush apparatus in the artist to accessible up the “theme editor.”
Now that we acquire lots of buttons and things, it’s time to accomplish them do something. Alpha by award the catechism TextView and ambience it to article random. We’ll do that in a new adjustment so we can calmly brace the catechism anniversary time.
Here’s what it will attending like:
The acknowledgment is all-around so we can analysis it adjoin the player’s attack later.
Pretty abundant aggregate actuality works the aforementioned as in Android Studio. The alone aberration is we aren’t application setText to change the question.
Of course, there’s one audacious limitation here: we’ve alone set one catechism so far, and it’s actuality apparent over and over again! Let’s accomplish a accidental number.
To do that, use these lines:
This will accomplish two accidental numbers in the ambit of 1-99 (so the aboriginal cardinal is across-the-board and the additional is not).
It won’t assignment appropriate abroad because you’ll charge to acceptation the accordant class, or — as Visual Studio puts it — you’re missing a administrator or accumulation reference. As in Android Studio, baddest the accent argument and columnist Alt + Return to break the problem. You’ll be prompted to add using System; to the top of your script.
To let the user attack to acknowledgment the question, you aboriginal charge to add an onClick. This is done hardly abnormally in Xamarin, as you’ll be application article alleged “delegate.” Agent is an article that contains advice about a adjustment — in this case, the onClick.
I’m artlessly activity to alarm a adjustment from the onClick, as that’s a hardly added organized way to handle it. Actuality is the method:
Here we’re aloof testing the amount of answer (which we set earlier) adjoin the amount we affective from the adapt text. Int.Parse lets us grab an accumulation from the argument acreage and as with Java, we use “==” to analyze the two numbers. We afresh either access the cardinal of appropriate answers or amiss answers, depending on the outcome, bright everything, and set the catechism again.
To analysis this app in the emulator, use the AVD Manager to actualize and barrage one and hit the blooming comedy button. Debugging in Visual Studio is nice and quick and alike highlights curve in your cipher area things went wrong. You could additionally bung in your Android accessory — aloof baddest it from the drop-down card abutting to the comedy button and hit go.
Using Xamarin is abundant for cross-platform development and for those who adopt C#. It’s absolutely a appealing nice acquaintance all-embracing too; it’s appealing quick compared to Android Studio and has a apple-pie UI.
If you’d like to see added Xamarin tutorials, let us apperceive in the comments bottomward beneath and we can attending at things like switching amid activities, application libraries, and more!
Creating your aboriginal project
Creating a UI
Generating questions
Checking answers
Testing the app and wrapping up
<ImageView android:layout_gravity="center" android:layout_width="200dp" android:layout_height="wrap_content" android:src="@drawable/logo" android:id="@+id/imageView1"/>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:orientation="vertical" android:layout_width="match_parent" android:layout_height="match_parent" android:minWidth="25px" android:minHeight="25px"> <ImageView android:layout_gravity="center" android:layout_width="200dp" android:layout_height="wrap_content" android:src="@drawable/logo" android:id="@+id/imageView1" /> <TextView android:layout_marginTop="10dp" android:layout_gravity="center" android:text="30 + 16" android:textAppearance="?android:attr/textAppearanceMedium" android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/question" /> <EditText android:layout_marginTop="10dp" android:layout_gravity="center" android:inputType="number" android:layout_width="match_parent" android:layout_height="wrap_content" android:id="@+id/answer" /> <Button android:text="Submit" android:layout_marginTop="20dp" android:layout_gravity="center" android:layout_width="match_parent" android:layout_height="wrap_content" android:id="@+id/submit" /> <TextView android:layout_height="match_parent" android:layout_width="match_parent" android:layout_weight="1" /> <TextView android:layout_marginTop="10dp" android:layout_gravity="left" android:text="Right: 0" android:textAppearance="?android:attr/textAppearanceMedium" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="0" android:id="@+id/right" /> <TextView android:layout_marginTop="10dp" android:layout_gravity="left" android:text="Wrong: 0" android:textAppearance="?android:attr/textAppearanceMedium" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_weight="0" android:id="@+id/wrong" />
int answer; clandestine abandoned setQuestion() { TextView catechism = FindViewById (Resource.Id.question); int no1 = 20; int no2 = 32; acknowledgment = no1 * no2; cord Q = "Q: " + no1 + " X " + no2; question.Text = Q; }
Random rnd = new Random(); int no1 = rnd.Next(1, 100); int no2 = rnd.Next(1, 100);
Button abide = FindViewById<button>(Resource.Id.submit); submit.Click += agent { checkAnswer(); };
int rightAnswers; int wrongAnswers; clandestine abandoned checkAnswer() { EditText attack = FindViewById(Resource.Id.answer); if (int.Parse(attempt.Text) == answer) { rightAnswers++; } else { wrongAnswers++; } attempt.Text = ""; setQuestion(); TextView appropriate = FindViewById(Resource.Id.right); TextView amiss = FindViewById(Resource.Id.wrong); right.Text = "Right: " + rightAnswers; wrong.Text = "Wrong: " + wrongAnswers; }
Comments
Post a Comment