I have created a lot of UI working on Android platform.
There, I used xml. What happens in android is that
when you have a fairly large UI screen with multiple blocks/sections
putting up all the code inside one xml file could be messy.
So they have provided tag.
What it does is :
We can create separate xml files defining separate components
and these separate xml files can be included inside one parent
xml.
This keeps the code very modular, easy to maintain and easy to debug.
Very recently I started working on HTML for some Web App,
and there is huge/huge UI on one single page.
i.e. multiple tabs and multiple sections in them.
Now, I don't want to put in everything inside one single html file.
Is there way by which I can create separate files and display them
one at a time or as per required.
You can get Angular.js and then user ng-route together with a custom directive. It's pretty simple actually.
Download their stuff. And then call it on your HTML.
Also, add this script aswell: //ajax.googleapis.com/ajax/libs/angularjs/1.2.1/angular-route.min.js
Should be pretty easy and you might learn something new.
Here, let me give you a hand. Create a file called app.js, add the following inside:
var app = angular.module('myapp', ['ngRoute'])
app.directive("nameOfElement", function () {
return {
templateUrl:'badassPartial.html'
};
});
On your HTML put this: <html ng-app="myapp">
Then create the file badassPartial.html this will be the partial.
And all you gotta do now is call it like so wherever you want to call it in your HTML: <name-of-element></name-of-element>
Note, the <name-of-element></name-of-element> is the name that you declare in app.directive("nameOfElement", function () { but for every camelCase you add a '-'
Hope this does something for you.
Also, you will need to create a new directive for every partial and then call their element.
Related
The question might seem incomprehensible just from the title alone so let me elaborate on what I mean. From what little I've dabbled in HTML and JavaScript, you could add HTML lines to the HTML file from using a Javascript function in the script.js file and it would add those HTML lines you've written into the function to the HTML file on execution and it would work as if you've written it in the HTML file to begin with. That was my understanding of how it worked, at least, if I'm wrong on my assessment feel free to correct me on that matter.
Anyway, I'm wondering if we could do a similar thing in Android Studio where we can use a Kotlin function to add an XML line/attribute/command like 'app:srcCompat="#drawable/whatever"' to an XML file.
Of course the question doesn't come from a mere sense of wonder. I currently have an application with a fragment that's supposed to get some football teams from the Room database and display them in CardViews using RecyclerView. In those cards, the team's name and their logo should be displayed. I don't have logos as image files in the Room database itself, however there is a column that stores the names of the drawable files in which the team logos are stored. (For example: Team A's logo is stored in the drawable's as 'teama.png' and it has 'teama' stored in a column.)
In the Adapter class of the RecyclerView, I want to use the bind() function to put the name and the logo on the cards. What I'm expecting to do (related to my question overall) is using a function that can take a string parameter ("app:srcCompat="#drawable/teama"") and puts it to the XML file of my team item. Is this possible? I'm open to other solutions as well and can post code if requested.
Thank you for your answer beforehand.
Is there a way to add XML code to an XML file from a Kotlin code?
Yes, but not in the context of what you are asking.
What I'm expecting to do (related to my question overall) is using a function that can take a string parameter ("app:srcCompat="#drawable/teama"") and puts it to the XML file of my team item. Is this possible?
No. You cannot modify the content of a resource XML file at runtime.
From what little I've dabbled in HTML and JavaScript, you could add HTML lines to the HTML file from using a Javascript function in the script.js file and it would add those HTML lines you've written into the function to the HTML file on execution and it would work as if you've written it in the HTML file to begin with.
JavaScript, run in the browser, does not modify the HTML file on the server. It modifies the DOM: the parsed representation of the HTML that is used by the browser to render a UI on the screen.
Similarly, in Android, you will need to update the View objects — created from parsing that resource XML file — to reflect your desired name and logo. This approach is covered in books and courses on Android app development. FWIW, here is a free book of mine on the subject.
Till now this technology is not available and if it is available it's not that famous and in use
There are scenarios in feature files wherein I've use the text "Foo" and on click its open a new page. this text sometime changes to "Foo1" or "Foo2" or to something else. to avoid line by line change in feature file for "Foo" to "Foo1" or "Foo2" is there any way that I can globally declare variable in top/bottom of the feature file where I can set the required text in variable on fly and I shall start executing my test instantly?
This change exist in many feature files and around 1000 lines in feature file. To get solution for this, I try on setting environment variables but I couldn't reach all the way till end this issue to solve. So can anyone help me on this?
Thanks in advance
What if you do the replacement in your step implementation instead? Then you could have the desired value in a separate file or pass it as arguments. That way you don't need to hard code the values.
Could scenario outlines help you in any way or is the value only changing depending on external changes?
My first thought was scenario outlines like #homaxto said.
Then I thought you might want to affect it by which system you are connected to. You can do this through configuration. I have done this with Fig_Newton.
You can either set an environment varaible or use one in the commandline. Or you can use #hook type tags. With a hook tag, you can have a tag at the top of a feature file that you can use to set a variable that affects how the steps operate (but it needs to be handled inside the step).
I'm trying to create a cross platform app using Xamarin.Forms. As far as I know, the UI will be created from the code and the .axml file will be generated automatically.
Can I modify the .axml file to edit the UI? I tried editing but all that comes up is what is written in the code. ie: hello forms
UPDATE
public static Page GetMainPage ()
{
return new simplerow ();
}
In Xamarin.Forms you can create your pages from markup definitions that are shared across all platforms.
Typically you will write all your content pages using Xamarin.Forms, however you can mix-and-match native pages into an application should you so wish.
These shared common pages, written in Xamarin.Forms, will reside maybe in a PCL project, or a Shared Project so these can then be re-used in the platform-specific projects, each targeting a specific platform OS.
You can write these common pages, either in code, or in XAML. You can even choose to write some pages one way, and some the other if you so choose.
A Xamarin.Forms page is processed at runtime through the interpretation of the page composition that has been created.
Each control that is specified on a page, has its own platform specific renderer, behind the scenes, that will produce output that is targetted to that OS.
When writing Xamarin.Forms pages, for-the-most, you will start to learn a new way of creating pages that is abstracted from the intricacies of creating mobile applications on each different platform OS.
There is therefore no editable .axml that is generated etc as you will write your pages using Xamarin.Forms markup and controls, and even your own or other custom-controls to produce your own application pages.
The following link shows some examples of how to write XAML pages.
The following link shows some examples of how to write from code-behind pages.
Along with the previous answer re: .xaml instead of .axml, you need to remember to change the startup code in app.cs to use your new .xaml form. Replace the "new ContentPage {...};" with "new MyForm();" (where "MyForm" is the name of your shiny new XAML form).
EDIT: Downloaded the project from the dropbox link. Comments below...
I see several issues here. I think you may need to go through the walkthroughs and sample applications provided by Xamarin to get up to speed with the concepts behind XF apps.
First, you are trying to use an Activity as your application's page. In a Xamarin Forms app, it must be a View of some sort, not a platform-specific visual such as Activity.
Second, remove the "test.xml" file from your Android project's Resources/layout folder; while XAML files are indeed XML, they have an 1) have a file extension of .xaml and 2) belong in the shared project.
Here's what you need to do to get your project working: (I'm assuming you're using VS here, under Xamarin Studio, it's slightly different.)
Right-click your "testforms" shared project
Click Add from the context menu and select "New Item"
In the dialog that appears, select "Forms XAML Page" and in the Name area enter a name (such as "MyForm")
(If you're using XS, choose "New File" and "Forms ContentPage")
This will add two files to your project: a XAML file containing your layout (e.g.: MyForm.xaml), and a code-behind file (e.g.: MyForm.xaml.cs).
Open the XAML file, and modify the Label element so that the Text attribute is
Text = "Hello, World!"
Modify the body of GetMainPage in your App.cs to the following:
return new MyForm();
Run the app
Hope this helps!
You got it wrong. Forms are created either through code or XAML. No axml or anything persistent is generated at platform level, everything is done in runtime(XAML is sort of compiled at compile time).
So, modify either code or XAML if you wish to change something. Or, if you need something more demanding, than consider either subclassing an existing Renderer or create you own.
Is there any way to intercept the Android framework's inflation of xml resources (menus and layouts) to change the strings it uses (e.g. for attributes like android:text="#string/button_trade_commit".)
I know it's possible to override getString() as it's called from an Activity. But framework code doesn't seem to use getString(). For example, in MenuInflator.java, strings come from mContext.obtainStyledAttributes(), and obtainStyledAttributes() is final: I can't override it.
Anybody know of another way to accomplish this?
Background: I want to allow non-English-speaking users to localize my app themselves. I imagine an interface that displays the English strings and lets them enter a translation which is then used in place of the English string from then on. I can imagine also providing a "Share translations" button that uploads the translations, and then,
on the server side, incorporating them into a downloadable module that other users of the same language would get. Being able to substitute strings at runtime is the blocking piece that I can't figure out.
I don't believe you can override the systems getString() methods the way you are looking at it.
It might be worth trying to use a custom attribute and handle the work there: http://developer.android.com/training/custom-views/create-view.html#customattr
I don't think you will be able to modify the process Android uses when inflating resources the way you wanted to.
What you can do is to simply not provide any strings (android:text, etc.) in XML files. You can always obtain a reference to any element in your XML file in the code. Once you have a reference, you can provide texts in the code, taking properly localized strings from your custom framework.
I am not sure about this, but i think you can examine the source of Calligraphy library for Android. It is overriding system LayoutInflater to change the FontType, so i imagine you can do the same to change the strings.
I'm working on a project for my university about customizing an Android application on runtime.
Is it possible to include layout XML files that are actually not in the \res\layout\ folder of my android project but on an external webserver?
The idea behind this is to give me an opportunity to customize the xml-file on my webserver, e.g. adding new fields, without having to re-install/update the app.
I'll try to explain my idea with the following example:
Let's say I got an application to save and display addresses. All addresses are stored in a database. I got the fields 'name' and 'surname' in my database and displayed in the app when saving or displaying the addresses.
Now I would like to add a third field 'email' where I can enter email addresses.
My idea is to create this field in my database and add it to my layout-xml-file which is on my webserver. So I can 'link' the xml file within the app and the new field appears after refreshing the app.
Hope you guys can give me some information about how to customize my input forms on runtime, my research on the internet didnt help me out at all..
Greetz
You can't use external XML files to dynamically adjust the layout.
The documentation of LayoutInflater#inflate(XmlPullParser, ViewGroup) explains why:
Important For performance reasons, view inflation relies heavily on pre-processing of XML files that is done at build time. Therefore, it is not currently possible to use LayoutInflater with an XmlPullParser over a plain XML file at runtime.
But you can create your layout dynamically in code, see e.g. Android Runtime Layout Tutorial
So you could put a file on the server that holds layout information, fetch it in your app, parse it and create the layout dynamically. It is going to be a lot of work since you would basically replicate Android's LayoutInflater. You can obviously simplify the format to just the basics that you need but it's still a lot of work that is IMHO not required.
Let's assume your layout info is just a plain text file that has name of fields
name
surname
email
You can then read it line by line and create a simple EditText for each in a way like
private View getDynamicLayout(ArrayList<String> lines) {
LinearLayout ll = new LinearLayout(this);
for (String line : lines) {
EditText et = new EditText(this);
// fill it with some text
et.setText(line);
ll.addView(ll);
}
return ll;
}
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
ArrayList<String> layoutConfig = readConfigFromFile();
View layout = getDynamicLayout(layoutConfig);
setContentView(layout);
}
But unless you really need that, I would suggest that you update the app the regular way. It is also faster to use preprocessed layouts instead of building that info on your own.
Also take care not do heavy disk / any network access in the UI thread like in above example (reading the file). That should be done in a background task.
Thanks a lot for your help. I'll try to get through this.
The reason I can't just update the app is that the app I'm talking about is actually a CRM system used by many different companies. They all have to download the same app from the google play store.
The goal of my work is that every company can customize their input forms on their own, so there could be many different input forms (each for every company) but all using the same app.
I thought about a server that stores a file with the layout information which can be accessed by the app on runtime.
btw, since I'm not a software engineer, I don't have to write any code, I only have to describe the concept in an abstract way.. :)