{"id":10286,"date":"2023-03-05T23:49:41","date_gmt":"2023-03-05T20:19:41","guid":{"rendered":"https:\/\/nabfollower.com\/blog\/lets-finally-build-our-app-la0\/"},"modified":"2023-03-05T23:49:41","modified_gmt":"2023-03-05T20:19:41","slug":"lets-finally-build-our-app-la0","status":"publish","type":"post","link":"https:\/\/nabfollower.com\/blog\/lets-finally-build-our-app-la0\/","title":{"rendered":"\u0628\u06cc\u0627\u06cc\u06cc\u062f \u062f\u0631 \u0646\u0647\u0627\u06cc\u062a \u0628\u0631\u0646\u0627\u0645\u0647 \u062e\u0648\u062f \u0631\u0627 \u0628\u0633\u0627\u0632\u06cc\u0645"},"content":{"rendered":"<div data-article-id=\"1384046\" id=\"article-body\">\n<p>\u06a9\u0627\u0631 \u0627\u0645\u0631\u0648\u0632 \u0645\u0627 \u062a\u0646\u0638\u06cc\u0645 \u0637\u0631\u062d \u0628\u0631\u0646\u0627\u0645\u0647 \u0628\u0627\u0644\u06cc\u0646\u06cc \u0646\u0647\u0627\u06cc\u06cc \u062e\u0648\u0627\u0647\u062f \u0628\u0648\u062f \u06a9\u0647 \u0686\u0646\u062f \u0631\u0648\u0632 \u067e\u06cc\u0634 \u062a\u0635\u0645\u06cc\u0645 \u06af\u0631\u0641\u062a\u06cc\u0645 \u0628\u0633\u0627\u0632\u06cc\u0645.  \u0645\u0627 \u062a\u0648\u0627\u0628\u0639 \u06a9\u0645\u06a9\u06cc \u0648 \u0628\u0631\u062e\u06cc \u0627\u0632 \u0642\u0648\u0627\u0646\u06cc\u0646 CSS \u0631\u0627 \u0645\u06cc \u0646\u0648\u06cc\u0633\u06cc\u0645.<\/p>\n<p>\u0647\u0641\u062a\u0647 \u06af\u0630\u0634\u062a\u0647\u060c \u0641\u0627\u06cc\u0644 \u0647\u0627\u06cc \u0632\u0627\u0648\u06cc\u0647 \u0627\u06cc \u0632\u06cc\u0627\u062f\u06cc \u0646\u0648\u0634\u062a\u06cc\u0645 \u0648 \u0632\u0645\u0627\u0646 \u0622\u0646 \u0641\u0631\u0627 \u0631\u0633\u06cc\u062f\u0647 \u0627\u0633\u062a \u06a9\u0647 \u0631\u0648\u06cc \u0631\u0627\u0628\u0637 \u06a9\u0627\u0631\u0628\u0631\u06cc \u062a\u0645\u0631\u06a9\u0632 \u06a9\u0646\u06cc\u0645.<\/p>\n<p>\u062f\u0631 \u067e\u0627\u06cc\u0627\u0646 \u0627\u06cc\u0646 \u0645\u0642\u0627\u0644\u0647\u060c \u0628\u0627\u06cc\u062f \u0627\u067e\u0644\u06cc\u06a9\u06cc\u0634\u0646\u06cc \u0634\u0628\u06cc\u0647 \u062a\u0635\u0648\u06cc\u0631 \u0632\u06cc\u0631 \u062f\u0627\u0634\u062a\u0647 \u0628\u0627\u0634\u06cc\u0645 <\/p>\n<p><\/p>\n<blockquote>\n<p>\u0645\u0642\u0627\u0644\u0647 \u0627\u0645\u0631\u0648\u0632 \u0628\u0633\u06cc\u0627\u0631 \u0641\u0646\u06cc \u062e\u0648\u0627\u0647\u062f \u0628\u0648\u062f.  \u0641\u0642\u0637 \u06a9\u0627\u0645\u067e\u06cc\u0648\u062a\u0631 \u0648 \u06a9\u062f \u062e\u0648\u062f \u0631\u0627 \u0628\u0631\u062f\u0627\u0631\u06cc\u062f.  \u0645\u06cc \u062a\u0648\u0627\u0646\u06cc\u062f \u06a9\u0644 \u06a9\u062f \u0631\u0627 \u062f\u0631 GitHub \u067e\u06cc\u062f\u0627 \u06a9\u0646\u06cc\u062f.<\/p>\n<\/blockquote>\n<div id=\"ez-toc-container\" class=\"ez-toc-v2_0_85 counter-hierarchy ez-toc-counter-rtl ez-toc-grey ez-toc-container-direction\">\n<div class=\"ez-toc-title-container\">\n<p class=\"ez-toc-title\" style=\"cursor:inherit\">\u0641\u0647\u0631\u0633\u062a \u0645\u0637\u0627\u0644\u0628<\/p>\n<span class=\"ez-toc-title-toggle\"><a href=\"#\" class=\"ez-toc-pull-right ez-toc-btn ez-toc-btn-xs ez-toc-btn-default ez-toc-toggle\" aria-label=\"Toggle Table of Content\"><span class=\"ez-toc-js-icon-con\"><span class=\"\"><span class=\"eztoc-hide\" style=\"display:none;\">Toggle<\/span><span class=\"ez-toc-icon-toggle-span\"><svg style=\"fill: #999;color:#999\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" class=\"list-377408\" width=\"20px\" height=\"20px\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M6 6H4v2h2V6zm14 0H8v2h12V6zM4 11h2v2H4v-2zm16 0H8v2h12v-2zM4 16h2v2H4v-2zm16 0H8v2h12v-2z\" fill=\"currentColor\"><\/path><\/svg><svg style=\"fill: #999;color:#999\" class=\"arrow-unsorted-368013\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"10px\" height=\"10px\" viewBox=\"0 0 24 24\" version=\"1.2\" baseProfile=\"tiny\"><path d=\"M18.2 9.3l-6.2-6.3-6.2 6.3c-.2.2-.3.4-.3.7s.1.5.3.7c.2.2.4.3.7.3h11c.3 0 .5-.1.7-.3.2-.2.3-.5.3-.7s-.1-.5-.3-.7zM5.8 14.7l6.2 6.3 6.2-6.3c.2-.2.3-.5.3-.7s-.1-.5-.3-.7c-.2-.2-.4-.3-.7-.3h-11c-.3 0-.5.1-.7.3-.2.2-.3.5-.3.7s.1.5.3.7z\"\/><\/svg><\/span><\/span><\/span><\/a><\/span><\/div>\n<nav><ul class='ez-toc-list ez-toc-list-level-1 ' ><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-1\" href=\"https:\/\/nabfollower.com\/blog\/lets-finally-build-our-app-la0\/#homecomponenthtml_%D8%AE%D9%88%D8%AF_%D8%B1%D8%A7_%D8%A8%D8%A7%D8%B2_%DA%A9%D9%86%DB%8C%D8%AF\" >home.component.html \u062e\u0648\u062f \u0631\u0627 \u0628\u0627\u0632 \u06a9\u0646\u06cc\u062f<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-2\" href=\"https:\/\/nabfollower.com\/blog\/lets-finally-build-our-app-la0\/#%D9%85%D8%A7_%D8%A8%D8%A7%DB%8C%D8%AF_%D8%AC%D8%B2%D8%A1_%D8%AE%D9%88%D8%AF_%D8%B1%D8%A7_%D8%A8%D9%87_%D8%B1%D9%88%D8%B2_%DA%A9%D9%86%DB%8C%D9%85\" >\u0645\u0627 \u0628\u0627\u06cc\u062f \u062c\u0632\u0621 \u062e\u0648\u062f \u0631\u0627 \u0628\u0647 \u0631\u0648\u0632 \u06a9\u0646\u06cc\u0645<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-3\" href=\"https:\/\/nabfollower.com\/blog\/lets-finally-build-our-app-la0\/#%D8%A8%DB%8C%D8%A7%DB%8C%DB%8C%D8%AF_%D8%AA%D9%88%D8%A7%D8%A8%D8%B9_%DA%A9%D9%85%DA%A9%DB%8C_%D8%B1%D8%A7_%D8%A7%DB%8C%D8%AC%D8%A7%D8%AF_%DA%A9%D9%86%DB%8C%D9%85\" >\u0628\u06cc\u0627\u06cc\u06cc\u062f \u062a\u0648\u0627\u0628\u0639 \u06a9\u0645\u06a9\u06cc \u0631\u0627 \u0627\u06cc\u062c\u0627\u062f \u06a9\u0646\u06cc\u0645<\/a><\/li><\/ul><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-4\" href=\"https:\/\/nabfollower.com\/blog\/lets-finally-build-our-app-la0\/#%D8%A8%DB%8C%D8%A7%DB%8C%DB%8C%D8%AF_%D8%B3%D8%A8%DA%A9%DB%8C_%D8%A8%D9%87_%D8%A8%D8%B1%D9%86%D8%A7%D9%85%D9%87_%D8%AE%D9%88%D8%AF_%D8%A7%D8%B6%D8%A7%D9%81%D9%87_%DA%A9%D9%86%DB%8C%D9%85\" >\u0628\u06cc\u0627\u06cc\u06cc\u062f \u0633\u0628\u06a9\u06cc \u0628\u0647 \u0628\u0631\u0646\u0627\u0645\u0647 \u062e\u0648\u062f \u0627\u0636\u0627\u0641\u0647 \u06a9\u0646\u06cc\u0645<\/a><\/li><li class='ez-toc-page-1 ez-toc-heading-level-2'><a class=\"ez-toc-link ez-toc-heading-5\" href=\"https:\/\/nabfollower.com\/blog\/lets-finally-build-our-app-la0\/#%D9%81%D9%88%D9%86%D8%AA_%D9%87%D8%A7%DB%8C_%D9%86%D9%85%D8%A7%D8%AF_%D8%B1%D8%A7_%D8%A7%D8%B6%D8%A7%D9%81%D9%87_%DA%A9%D9%86%DB%8C%D8%AF\" >\u0641\u0648\u0646\u062a \u0647\u0627\u06cc \u0646\u0645\u0627\u062f \u0631\u0627 \u0627\u0636\u0627\u0641\u0647 \u06a9\u0646\u06cc\u062f<\/a><ul class='ez-toc-list-level-3' ><li class='ez-toc-heading-level-3'><a class=\"ez-toc-link ez-toc-heading-6\" href=\"https:\/\/nabfollower.com\/blog\/lets-finally-build-our-app-la0\/#%D8%A8%D8%B1%D9%86%D8%A7%D9%85%D9%87_%D8%AE%D9%88%D8%AF_%D8%B1%D8%A7_%D8%AA%D8%B3%D8%AA_%DA%A9%D9%86%DB%8C%D8%AF%D8%8C_%D8%A7%D8%AC%D8%B1%D8%A7_%DA%A9%D9%86%DB%8C%D8%AF\" >\u0628\u0631\u0646\u0627\u0645\u0647 \u062e\u0648\u062f \u0631\u0627 \u062a\u0633\u062a \u06a9\u0646\u06cc\u062f\u060c \u0627\u062c\u0631\u0627 \u06a9\u0646\u06cc\u062f:<\/a><\/li><\/ul><\/li><\/ul><\/nav><\/div>\n<h2><span class=\"ez-toc-section\" id=\"homecomponenthtml_%D8%AE%D9%88%D8%AF_%D8%B1%D8%A7_%D8%A8%D8%A7%D8%B2_%DA%A9%D9%86%DB%8C%D8%AF\"><\/span>\n<p>  home.component.html \u062e\u0648\u062f \u0631\u0627 \u0628\u0627\u0632 \u06a9\u0646\u06cc\u062f<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\u0635\u0641\u062d\u0647 \u0628\u0631\u0646\u0627\u0645\u0647 \u0645\u0627 \u0628\u0627\u06cc\u062f \u062a\u0645\u0627\u0645 \u0641\u0636\u0627\u06cc \u0645\u0648\u062c\u0648\u062f \u0631\u0627 \u0627\u0634\u063a\u0627\u0644 \u06a9\u0646\u062f \u0648 \u0628\u0647 \u062f\u0648 \u0642\u0633\u0645\u062a \u062a\u0642\u0633\u06cc\u0645 \u0634\u0648\u062f:<\/p>\n<ul>\n<li>\n<p>\u0628\u062e\u0634\u06cc \u06a9\u0647 \u0639\u0645\u062f\u062a\u0627\u064b \u0639\u0645\u0644\u06cc\u0627\u062a \u0631\u0627 \u0646\u0634\u0627\u0646 \u0645\u06cc \u062f\u0647\u062f (\u0628\u0647 \u0639\u0646\u0648\u0627\u0646 \u0645\u062b\u0627\u0644 \u0627\u0639\u062f\u0627\u062f\u060c \u062d\u0627\u0644\u062a \u0641\u0639\u0644\u06cc \u0627\u0646\u062a\u062e\u0627\u0628 \u0634\u062f\u0647 \u062a\u0648\u0633\u0637 \u06a9\u0627\u0631\u0628\u0631).<\/p>\n<\/li>\n<li>\n<p>\u0642\u0633\u0645\u062a \u062f\u06cc\u06af\u0631\u06cc \u06a9\u0647 \u062f\u06a9\u0645\u0647 \u0647\u0627\u06cc \u062e\u0648\u062f \u0631\u0627 \u062f\u0631 \u0622\u0646 \u0642\u0631\u0627\u0631 \u062f\u0647\u06cc\u0645.<\/p>\n<\/li>\n<\/ul>\n<p>\u0628\u06cc\u0627\u06cc\u06cc\u062f \u0633\u067e\u0633 \u0637\u0631\u062d \u0628\u0646\u062f\u06cc \u0647\u0627\u06cc \u0634\u0628\u06a9\u0647 \u0627\u06cc \u062e\u0648\u062f \u0631\u0627 \u0628\u0646\u0648\u06cc\u0633\u06cc\u0645.<\/p>\n<p>\u0645\u0627 \u0627\u0632 \u0627\u0648\u0644\u06cc\u0646 \u0628\u0647 \u0639\u0646\u0648\u0627\u0646 \u06a9\u0627\u0646\u062a\u06cc\u0646\u0631 \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u0645\u06cc \u06a9\u0646\u06cc\u0645 \u06a9\u0647 \u0646\u0645\u0627\u06cc\u0634\u06af\u0631 \u0635\u0641\u062d\u0647 \u0628\u0631\u0646\u0627\u0645\u0647 \u0645\u0627 \u0627\u0633\u062a.<\/p>\n<p>\u062f\u0648 \u0645\u0648\u0631\u062f \u062f\u06cc\u06af\u0631 \u0628\u0647 \u062a\u0631\u062a\u06cc\u0628 \u0628\u0647 \u0639\u0646\u0648\u0627\u0646 \u0645\u062d\u0641\u0638\u0647 \u0635\u0641\u062d\u0647 \u0639\u0645\u0644\u06cc\u0627\u062a \u0648 \u0645\u062d\u0641\u0638\u0647 \u0635\u0641\u062d\u0647 \u0646\u0645\u0627\u06cc\u0634 \u062f\u06a9\u0645\u0647 \u0647\u0627 \u0639\u0645\u0644 \u062e\u0648\u0627\u0647\u0646\u062f \u06a9\u0631\u062f.<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight plaintext\"><code>&lt;GridLayout rows=\"300, *\" columns=\"*\" class=\"container\" height \n=\"100%\" backgroundColor=\"#303030\"&gt; \n\n    &lt;GridLayout  row=\"0\" col=\"0\" backgroundColor=\"#303030\" columns=\"20,*\" rows=\"40, *,*,*,*\"&gt; \n    &lt;\/GridLayout&gt;\n\n\n &lt;GridLayout\u00a0row=\"1\"\u00a0col=\"0\"\u00a0backgroundColor=\"#303030\"\u00a0columns=\"*,10,*,10,*,10,*\"\u00a0rows=\"*,*,*,*,*\"&gt;\n\n    &lt;\/GridLayout&gt;\n\n&lt;\/GridLayout&gt;\n\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<p>\u0632\u0645\u0627\u0646 \u0627\u0636\u0627\u0641\u0647 \u06a9\u0631\u062f\u0646 \u062f\u06a9\u0645\u0647 \u0647\u0627 \u0648 \u0635\u0641\u062d\u0647 \u0646\u0645\u0627\u06cc\u0634 \u0647\u0627 \u0627\u0633\u062a.<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight plaintext\"><code>&lt;GridLayout columns=\"*\" rows=\"300, *\" height=\"100%\" *ngIf=\"currentMode != modes.fg &amp;&amp; currentMode != modes.apgar\"&gt;\n\n    &lt;GridLayout row=\"0\" col=\"0\" backgroundColor={{colors.gray}} columns=\"20,*\" rows=\"40, *,*,*,*\"\n        *ngIf=\"currentMode == modes.pam\"&gt;\n        &lt;TextView editable=\"false\" col=\"1\" row=\"1\" class=\"uxText\" color=\"aquamarine\"&gt;\n            __{{currentMode}}__\n        &lt;\/TextView&gt;\n        &lt;FlexBoxLayout col=\"1\" , row=\"2\"&gt;\n            &lt;TextView editable=\"false\" col=\"0\" row=\"1\" *ngIf=\"pamArray[0]\" class=\"uxText\"&gt;\n                PAS: {{pamArray[0]}}\n            &lt;\/TextView&gt;\n            &lt;TextView editable=\"false\" col=\"0\" row=\"2\" *ngIf=\"pamArray[1]\" class=\"uxText\"&gt;\n                PAD: {{pamArray[1]}}\n            &lt;\/TextView&gt;\n\n            &lt;TextView editable=\"false\" col=\"0\" row=\"2\" *ngIf=\"!pamArray[0] &amp;&amp; !reponse\" class=\"uxText\"&gt;\n                Valeur systole\n            &lt;\/TextView&gt;\n            &lt;TextView editable=\"false\" col=\"0\" row=\"2\" *ngIf=\"pamArray[0] &amp;&amp; !pamArray[1]\" class=\"uxText\"&gt;\n                Valeur diastole\n            &lt;\/TextView&gt;\n        &lt;\/FlexBoxLayout&gt;\n\n\n        &lt;TextView editable=\"false\" col=\"1\" row=\"3\" class=\"operation\" fontSize=\"32rem\"&gt;\n            {{screen}}\n        &lt;\/TextView&gt;\n\n        &lt;TextView editable=\"false\" col=\"1\" row=\"4\" class=\"operation\"&gt;\n            {{reponse}}\n        &lt;\/TextView&gt;\n\n    &lt;\/GridLayout&gt;\n&lt;GridLayout row=\"0\" col=\"0\" backgroundColor={{colors.gray}} columns=\"20,*\" rows=\"40, *,*,*,*\"\n        *ngIf=\"currentMode == modes.imc\"&gt;\n\n        &lt;TextView editable=\"false\" col=\"1\" row=\"1\" class=\"uxText\" color=\"aquamarine\"&gt;\n            __{{currentMode}}__\n        &lt;\/TextView&gt;\n\n        &lt;TextView editable=\"false\" col=\"1\" row=\"3\" class=\"operation\"&gt;\n            {{screen}}\n        &lt;\/TextView&gt;\n\n\n        &lt;FlexBoxLayout col=\"1\" , row=\"2\"&gt;\n            &lt;TextView editable=\"false\" col=\"0\" row=\"1\" class=\"active\" *ngIf=\"imcArray[0]\"&gt;\n                Taille: {{imcArray[0]}}\n            &lt;\/TextView&gt;\n            &lt;TextView editable=\"false\" col=\"0\" row=\"2\" class=\"active\" *ngIf=\"imcArray[1]\"&gt;\n                Poids: {{imcArray[1]}}\n            &lt;\/TextView&gt;\n\n            &lt;TextView editable=\"false\" col=\"0\" row=\"2\" *ngIf=\"!imcArray[0] &amp;&amp; !reponse\" class=\"uxText\"&gt;\n                Valeur taille(cm)\n            &lt;\/TextView&gt;\n            &lt;TextView editable=\"false\" col=\"0\" row=\"2\" *ngIf=\"imcArray[0] &amp;&amp; !imcArray[1]\" class=\"uxText\"&gt;\n                Valeur poids(kg)\n            &lt;\/TextView&gt;\n        &lt;\/FlexBoxLayout&gt;\n\n\n        &lt;TextView editable=\"false\" col=\"1\" row=\"4\" class=\"operation \"&gt;\n            {{reponse}}\n        &lt;\/TextView&gt;\n\n    &lt;\/GridLayout&gt;\n\n\n\n\n    &lt;GridLayout row=\"1\" col=\"0\" backgroundColor=\"#303030\" columns=\"*,10,*,10,*,10,*\" rows=\"*,*,*,*,*\" paddingBottom=\"25\"\n        borderTopLeftRadius=\"20\" borderTopRightRadius=\"20\"&gt;\n        &lt;Button row=\"0\" col=\"0\" text={{currentMode}}  #ac fontSize=\"16px\" disabled&gt;&lt;\/Button&gt;\n        &lt;Button row=\"0\" col=\"2\" text=\"AC\" fontSize=\"20\" #back (tap)=\"bck()\"&gt;&lt;\/Button&gt;\n        &lt;Button row=\"0\" col=\"4\" text=\"&gt;\" class=\"nextBtn\" #pour (tap)=\"next()\" backgroundColor=\"#001A11\" color=\"aquamarine\"\n            fontSize=\"32\"&gt;&lt;\/Button&gt;\n        &lt;Button row=\"0\" col=\"6\" text={{modes.pam}} class=\"op\" #div (tap)=\"changeMode(div)\"&gt;&lt;\/Button&gt;\n\n        &lt;Button row=\"1\" col=\"0\" text=\"7\" class=\"btn\" #sept (tap)=\"getAnim(sept)\"&gt;&lt;\/Button&gt;\n        &lt;Button row=\"1\" col=\"2\" text=\"8\" class=\"btn\" #huit (tap)=\"getAnim(huit)\"&gt;&lt;\/Button&gt;\n        &lt;Button row=\"1\" col=\"4\" text=\"9\" class=\"btn\" #neuf (tap)=\"getAnim(neuf)\"&gt;&lt;\/Button&gt;\n        &lt;Button row=\"1\" col=\"6\" text=\"{{modes.apgar}}\" class=\"op\" #fois [nsRouterLink]=\"['\/apgar']\"&gt;&lt;\/Button&gt;\n\n\n        &lt;Button row=\"2\" col=\"0\" text=\"4\" class=\"btn\" #quatre (tap)=\"getAnim(quatre)\"&gt;&lt;\/Button&gt;\n        &lt;Button row=\"2\" col=\"2\" text=\"5\" class=\"btn\" #cinq (tap)=\"getAnim(cinq)\"&gt;&lt;\/Button&gt;\n        &lt;Button row=\"2\" col=\"4\" text=\"6\" class=\"btn\" #six (tap)=\"getAnim(six)\"&gt;&lt;\/Button&gt;\n        &lt;Button row=\"2\" col=\"6\" text={{modes.imc}} class=\"op\" #mois (tap)=\"changeMode(mois)\"&gt;&lt;\/Button&gt;\n\n\n        &lt;Button row=\"3\" col=\"0\" text=\"1\" class=\"btn\" #un (tap)=\"getAnim(un)\"&gt;&lt;\/Button&gt;\n        &lt;Button row=\"3\" col=\"2\" text=\"2\" class=\"btn\" #deux (tap)=\"getAnim(deux)\"&gt;&lt;\/Button&gt;\n        &lt;Button row=\"3\" col=\"4\" text=\"3\" class=\"btn\" #trois (tap)=\"getAnim(trois)\"&gt;&lt;\/Button&gt;\n\n\n        &lt;Button row=\"4\" col=\"0\" text=\"C\" class=\"btn\" #ext (tap)=\"reset()\"&gt;&lt;\/Button&gt;\n        &lt;Button row=\"4\" col=\"2\" text=\"0\" class=\"btn\" #zero (tap)=\"getAnim(zero)\"&gt;&lt;\/Button&gt;\n        &lt;Button row=\"4\" col=\"4\" text=\".\" class=\"btn\" #point (tap)=\"getAnim(point)\" value=\".\"&gt;&lt;\/Button&gt;\n        &lt;Button row=\"4\" col=\"6\" text=\"=\" class=\"opBtm\" #egal (tap)=\"next()\"&gt;&lt;\/Button&gt;\n    &lt;\/GridLayout&gt;\n&lt;\/GridLayout&gt;\n\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<h2><span class=\"ez-toc-section\" id=\"%D9%85%D8%A7_%D8%A8%D8%A7%DB%8C%D8%AF_%D8%AC%D8%B2%D8%A1_%D8%AE%D9%88%D8%AF_%D8%B1%D8%A7_%D8%A8%D9%87_%D8%B1%D9%88%D8%B2_%DA%A9%D9%86%DB%8C%D9%85\"><\/span>\n<p>  \u0645\u0627 \u0628\u0627\u06cc\u062f \u062c\u0632\u0621 \u062e\u0648\u062f \u0631\u0627 \u0628\u0647 \u0631\u0648\u0632 \u06a9\u0646\u06cc\u0645<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight plaintext\"><code>import { Component, OnInit } from '@angular\/core'\nimport { Button, Color } from '@nativescript\/core';\nimport { Page } from '@nativescript\/core\/ui\/page';\nimport { checkState, clear, compute, back, scaleAnim} from '..\/common\/functions'\n@Component({\n  selector: 'Home',\n  templateUrl: '.\/home.component.html',\n  styleUrls: [\".\/home.component.css\"],\n})\nexport class HomeComponent implements OnInit {\n  \/\/members of the class\n  screen = \"\";\n  reponse = \"\";\n  pam = true;\n  apgar = false;\n  fg = false;\n  imc = false;\n\n  modes = {\n    imc: \"IMC\",\n    fg: \"FG\",\n    apgar: \"AP\",\n    pam: \"PAM\"\n  }\n  currentMode = this.modes.pam;\n  images = {\n    back: \"~\/assets\/back.svg\"\n  }\n\n  pamArray = [];\n  imcArray = [];\n  colors = {\n    gray: new Color(\"#383838\")\n  }\n\n  \/\/end Members of the class definition\n\n  \/************************************* Methods ******************************************\/\n\n\n  \/**\n   * getAnim - saves the buttons typed to the screen\n   * @param btn : Button clicked by the user\n   *\/\n  getAnim = (btn: Button) =&gt; {\n    scaleAnim(btn);\n    if(checkState(this.reponse)){\n      this.reponse = clear(this.reponse);\n      this.pamArray = [];\n      this.imcArray = [];\n    }\n    this.screen += btn.text;\n  }\n  \/**\n   * reset - resets the screen and all the variables\n   *\/\n\n  reset = ()=&gt;{\n    this.reponse = clear(this.reponse);\n    this.pamArray = [];\n    this.imcArray = [];\n    this.screen = clear(this.screen);\n  }\n\n  \/**\n   * changeMode - changes the mode of the calculator\n   * and updates the screen accordingly\n   * @param btn : Button clicked by the user\n   *\/\n  changeMode(btn: Button) {\n    const mode = btn.text;\n    if (mode != this.currentMode) {\n      this.screen = clear(this.screen);\n      this.reponse = clear(this.reponse);\n      this.imcArray = [];\n      this.pamArray = [];\n    };\n    this.currentMode = mode;\n\n  }\n\n  \/**\n   * bck - invokes the back function\n   * to delete the latest entered char in the screen\n   *\/\n  bck(){\n    this.screen = back(this.screen);\n  }\n\n  \/**\n   * next - saves variables and do the computations\n   * according to the selected mode\n   *\/\n  next() {\n    \/\/checks that the current mode is indeed \"PAM\"\n    if (this.currentMode == this.modes.pam) {\n      \/\/computations for the \"PAM\" mode.\n      if (!this.screen &amp;&amp; !this.pamArray[0]){}\n      if (this.pamArray[0] &amp;&amp; this.pamArray[1]) {\n        this.reponse = String(compute(\"PAM\", this.pamArray));\n        this.pamArray = [];\n        this.screen = clear(this.screen);\n      }\n      this.pamArray.push(Number(this.screen));\n      this.screen = clear(this.screen);\n    }\nelse if(this.currentMode == this.modes.imc){\n      \/\/computationa for the \"IMC\" mode.\n      if (!this.screen &amp;&amp; !this.imcArray[0]){}\n      if (this.imcArray[0] &amp;&amp; this.imcArray[1]) {\n        this.reponse = String(compute(\"IMC\", this.imcArray));\n        this.imcArray = [];\n        this.screen = clear(this.screen);\n      }\n      this.imcArray.push(Number(this.screen));\n      this.screen = clear(this.screen);\n    }\n\n  }\n\n  constructor(private page: Page) {\n    this.page.actionBarHidden = true;\n\n  }\n\n  ngOnInit(): void {\n\n\n  }\n}\n\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<h3><span class=\"ez-toc-section\" id=\"%D8%A8%DB%8C%D8%A7%DB%8C%DB%8C%D8%AF_%D8%AA%D9%88%D8%A7%D8%A8%D8%B9_%DA%A9%D9%85%DA%A9%DB%8C_%D8%B1%D8%A7_%D8%A7%DB%8C%D8%AC%D8%A7%D8%AF_%DA%A9%D9%86%DB%8C%D9%85\"><\/span>\n<p>  \u0628\u06cc\u0627\u06cc\u06cc\u062f \u062a\u0648\u0627\u0628\u0639 \u06a9\u0645\u06a9\u06cc \u0631\u0627 \u0627\u06cc\u062c\u0627\u062f \u06a9\u0646\u06cc\u0645<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p>\u0645\u0627\u0634\u06cc\u0646 \u062d\u0633\u0627\u0628 \u0645\u0627 \u0646\u06cc\u0627\u0632 \u0628\u0647 \u0645\u062d\u0627\u0633\u0628\u0647 \u0628\u0633\u06cc\u0627\u0631\u06cc \u0627\u0632 \u0645\u0648\u0627\u0631\u062f \u062f\u0627\u0631\u062f.  \u0628\u06cc\u0627\u06cc\u06cc\u062f \u06cc\u06a9 \u067e\u0648\u0634\u0647 \u0628\u0647 \u0646\u0627\u0645 \u0627\u06cc\u062c\u0627\u062f \u06a9\u0646\u06cc\u0645 <em>\u0645\u0634\u062a\u0631\u06a9<\/em> \u0648 \u06cc\u06a9 \u0641\u0627\u06cc\u0644 \u06a9\u0647 \u0646\u0627\u0645 \u0622\u0646 \u0631\u0627 \u062e\u0648\u0627\u0647\u06cc\u0645 \u06af\u0641\u062a <em>\u06a9\u0627\u0631\u06a9\u0631\u062f<\/em> \u06a9\u0647 \u062f\u0631 \u0622\u0646 \u0645\u0627 \u062a\u06a9 \u062a\u06a9 \u0639\u0645\u0644\u06a9\u0631\u062f\u0647\u0627\u06cc \u06a9\u0645\u06a9\u06cc \u0644\u0627\u0632\u0645 \u0628\u0631\u0627\u06cc \u0628\u0631\u0646\u0627\u0645\u0647 \u062e\u0648\u062f \u0631\u0627 \u0642\u0631\u0627\u0631 \u0645\u06cc \u062f\u0647\u06cc\u0645.<\/p>\n<p>\u0645\u0646 \u06a9\u062f \u0631\u0627 \u06a9\u0627\u0645\u0646\u062a \u06a9\u0631\u062f\u0645\u060c \u0628\u0646\u0627\u0628\u0631\u0627\u06cc\u0646\u060c \u062f\u0631\u06a9 \u0622\u0646 \u0628\u0627\u06cc\u062f \u0622\u0633\u0627\u0646 \u0628\u0627\u0634\u062f.<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight plaintext\"><code>export function back(screen: string){\nimport { ElementRef, ViewChild } from \"@angular\/core\";\nimport { Button } from \"@nativescript\/core\";\nexport const formulas = {\n    pam: \"[(PAS + (2 x PAD) )\/3]\",\n    imc: \"[Poids(Kg)\/Taille^2(m)]\"\n}\n\/**\n * clear - functions to clear the screen\n * @param screen : the screen to be cleared\n *\/\nexport function clear(screen: string){\n    screen = \"\";\n    return screen;\n}\n\/**\n * \n * @param mode the mode chosen by the user\n * @param dest the place of the screen where \n * the mode should be displayed\n *\/\nexport function changeMode(mode: string, dest: string){\n    dest = mode;\n}\n\n\/**\n * \n * @param pas systolic arterial pressure\n * @param pad diastolic arterial pressure\n * @returns mean arterial pressure\n *\/\nexport function pam(pas: number, pad: number){\n    return (2*(pad) + pas)\/3\n}\n\n\n\/**\n * imc - computes the IMC\n * @param taille: length in cm\n * @param poids: weight in Kg\n * @returns the IMC\n *\/\nexport function imc(taille: number, poids: number){\n    taille = converter(taille);\n    const tailleCarre = Math.pow(taille, 2);\n    return poids\/tailleCarre;\n\n}\n\/**\n * compute - finds the right formula and computes according to\n * the mode\n * @param mode the mode chosen by the user\n * @param store the array where are stored variables\n * @returns the desired computation\n *\/\nexport function compute(mode: string, store: string[]){\n    switch (mode) {\n        case \"PAM\":\n            return pam(Number(store[0]), Number(store[1]))\n        case \"IMC\":\n            return imc(Number(store[0]), Number(store[1]))\n    }\n}\n\/**\n * pusher - stores the first param in an array\n * @param screen the screen containing the first param\n * @param store the array where to store thr first param\n *\/\nexport function pusher(screen: string, store: Array&lt;string&gt;){\n    store.push(screen);\n    clear(screen);\n}\n\/**\n * scaleAnim - animates the btn to scale 0.5 times\n * from its original state\n * @param btn : the button to be animated\n *\/\nexport function scaleAnim(btn: Button){\n    btn.animate({\n        scale:{x:1.5, y:1.5},\n        duration: 1,\n        curve: \"easeOut\",\n        iterations: 1,\n    }).then(()=&gt;{\n        btn.animate({\n            scale: {x:1, y:1}\n        })\n    })\n}\n\/**\n * checkState - checks the state of the screen\n * @param screen : the screen to be checked\n * @returns true if the screen is not empty\n * false otherwise\n *\/\nexport function checkState(screen: string){\n    return screen?true:false;\n}\n\n\/**\n * getFormula - returns the formula of the selected mode \n * @param mode : the formula to be ruturned\n *\/\nexport function getFormula(mode: string){\n    switch (mode) {\n        case \"PAM\" || \"pam\":\n            return formulas.pam;\n        default:\n            break;\n    }\n}\n\/**\n * back - delete the latest entered value in the screen\n * @param screen the screen to be sliced\n * @returns a new string\n *\/\nexport function back(screen: string){\n    if (screen){\n        const len = screen.length - 1;\n        return screen.slice(0, len);\n}\n    else{\n        return screen;\n}\n}\n\/**\n * converter - converts the length from cm to m\n * @params len: the length in cm\n * @returns len in m\n *\/\nexport function converter(len: number){\n    return len\/100;\n}\n\n\/**\n * choose - helps make a choice on 3 radio btns \n * @param vcActive : the active viewChild\n * @param vc1 : an ElementRef to reset\n * @param vc2 : an ElementRef to reset\n * @param btn : the button used to toggle the change\n *\/\nexport async function choose(vcActive: ElementRef, vc1: ElementRef, vc2: ElementRef, btn?: Button){\n    vcActive.nativeElement.toggle();\n    vc1.nativeElement.checked = false;\n    vc2.nativeElement.checked = false;\n}\n\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<h2><span class=\"ez-toc-section\" id=\"%D8%A8%DB%8C%D8%A7%DB%8C%DB%8C%D8%AF_%D8%B3%D8%A8%DA%A9%DB%8C_%D8%A8%D9%87_%D8%A8%D8%B1%D9%86%D8%A7%D9%85%D9%87_%D8%AE%D9%88%D8%AF_%D8%A7%D8%B6%D8%A7%D9%81%D9%87_%DA%A9%D9%86%DB%8C%D9%85\"><\/span>\n<p>  \u0628\u06cc\u0627\u06cc\u06cc\u062f \u0633\u0628\u06a9\u06cc \u0628\u0647 \u0628\u0631\u0646\u0627\u0645\u0647 \u062e\u0648\u062f \u0627\u0636\u0627\u0641\u0647 \u06a9\u0646\u06cc\u0645<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\u0641\u0627\u06cc\u0644 home.component.css \u0631\u0627 \u0628\u0627\u0632 \u06a9\u0646\u06cc\u062f \u0648 \u0622\u0646 \u0642\u0648\u0627\u0646\u06cc\u0646 \u0631\u0627 \u0628\u0646\u0648\u06cc\u0633\u06cc\u062f<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight plaintext\"><code>.op{\n    color: aquamarine;\n    background-color: transparent;\n    font-size: 16em;\n    margin-top: 8px;\n    margin-bottom: 8px;\n    z-index: 0;\n  }\n  .opBtm{\n    border-radius:50%;\n    background-color: gray;\n    font-size: 25px;\n    margin-bottom: 30px;\n    z-index: 0;\n\n  }\n  .opBtm{\n    box-shadow:  0 0 30px gray;\n  }\n\n\n  .uxText{\n    color: white;\n    font-style: italic;  \n}\n  .btn{\n    color: #ccc;\n    background-color: transparent;\n    font-size: 35em;\n    margin-top: 8px;\n    margin-bottom: 8px;\n    z-index: 0;\n\n  }\n\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<h2><span class=\"ez-toc-section\" id=\"%D9%81%D9%88%D9%86%D8%AA_%D9%87%D8%A7%DB%8C_%D9%86%D9%85%D8%A7%D8%AF_%D8%B1%D8%A7_%D8%A7%D8%B6%D8%A7%D9%81%D9%87_%DA%A9%D9%86%DB%8C%D8%AF\"><\/span>\n<p>  \u0641\u0648\u0646\u062a \u0647\u0627\u06cc \u0646\u0645\u0627\u062f \u0631\u0627 \u0627\u0636\u0627\u0641\u0647 \u06a9\u0646\u06cc\u062f<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h2>\n<p>\u0645\u0646 \u0639\u0627\u0634\u0642 \u0645\u062a\u0631\u06cc\u0627\u0644 Angular \u0647\u0633\u062a\u0645\u060c \u0628\u0646\u0627\u0628\u0631\u0627\u06cc\u0646 \u0627\u0632 \u0646\u0645\u0627\u062f\u0647\u0627\u06cc \u0645\u062a\u0631\u06cc\u0627\u0644 Google \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u062e\u0648\u0627\u0647\u0645 \u06a9\u0631\u062f.<\/p>\n<p>\u062f\u0631 \u0645\u0646\u0628\u0639 \u0628\u0631\u0646\u0627\u0645\u0647 \u062e\u0648\u062f\u060c \u06cc\u06a9 \u067e\u0648\u0634\u0647 \u0627\u06cc\u062c\u0627\u062f \u06a9\u0646\u06cc\u062f \u0648 \u0646\u0627\u0645 \u0622\u0646 \u0631\u0627 \u0628\u06af\u0630\u0627\u0631\u06cc\u062f <em>\u0641\u0648\u0646\u062a \u0647\u0627<\/em> <\/p>\n<p>\u0641\u0648\u0646\u062a \u0647\u0627 \u0631\u0627 \u0627\u0632 \u0627\u06cc\u0646\u062c\u0627 \u062f\u0627\u0646\u0644\u0648\u062f \u06a9\u0646\u06cc\u062f \u0648 \u062f\u0631 \u0622\u0646 \u0642\u0631\u0627\u0631 \u062f\u0647\u06cc\u062f <em>\u0641\u0648\u0646\u062a \u0647\u0627<\/em> \u067e\u0648\u0634\u0647<\/p>\n<p>\u062f\u0631 \u0641\u0627\u06cc\u0644 CSS \u062e\u0648\u062f \u0627\u06cc\u0646 \u0642\u0648\u0627\u0646\u06cc\u0646 \u0631\u0627 \u0628\u0646\u0648\u06cc\u0633\u06cc\u062f<\/p>\n<div class=\"highlight js-code-highlight\">\n<pre class=\"highlight plaintext\"><code>.m-icon-outlined{\n     font-family: \"MaterialIcons-Outlined\";\n     font-weight: 400;\n}\n\n\n<\/code><\/pre>\n<div class=\"highlight__panel js-actions-panel\">\n<div class=\"highlight__panel-action js-fullscreen-code-action\">\n    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-on\"><title>\u0648\u0627\u0631\u062f \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M16 3h6v6h-2V5h-4V3zM2 3h6v2H4v4H2V3zm18 16v-4h2v6h-6v-2h4zM4 19h4v2H2v-6h2v4z\"\/>\n<\/svg><\/p>\n<p>    <svg xmlns=\"http:\/\/www.w3.org\/2000\/svg\" width=\"20px\" height=\"20px\" viewbox=\"0 0 24 24\" class=\"highlight-action crayons-icon highlight-action--fullscreen-off\"><title>\u0627\u0632 \u062d\u0627\u0644\u062a \u062a\u0645\u0627\u0645 \u0635\u0641\u062d\u0647 \u062e\u0627\u0631\u062c \u0634\u0648\u06cc\u062f<\/title>\n    <path d=\"M18 7h4v2h-6V3h2v4zM8 9H2V7h4V3h2v6zm10 8v4h-2v-6h6v2h-4zM8 15v6H6v-4H2v-2h6z\"\/>\n<\/svg><\/p>\n<\/div>\n<\/div>\n<\/div>\n<p>\u0628\u0647 \u062e\u0627\u0637\u0631 \u062f\u0627\u0634\u062a\u0647 \u0628\u0627\u0634\u06cc\u062f \u06a9\u0647 \u0646\u0627\u0645 \u062e\u0627\u0646\u0648\u0627\u062f\u06af\u06cc \u0641\u0648\u0646\u062a \u0628\u0627\u06cc\u062f \u0628\u0627 \u0646\u0627\u0645 \u0641\u0648\u0646\u062a \u0645\u0648\u062c\u0648\u062f \u062f\u0631 \u067e\u0648\u0634\u0647 \u0641\u0648\u0646\u062a \u0634\u0645\u0627 \u0645\u0637\u0627\u0628\u0642\u062a \u062f\u0627\u0634\u062a\u0647 \u0628\u0627\u0634\u062f.  \u0628\u0631\u0627\u06cc \u06cc\u0627\u0641\u062a\u0646 \u06a9\u062f \u06cc\u06a9 \u0646\u0645\u0627\u062f \u0627\u06cc\u0646\u062c\u0627 \u0631\u0627 \u06a9\u0644\u06cc\u06a9 \u06a9\u0646\u06cc\u062f.  \u0645\u0627 \u0627\u0632 \u0622\u0646 \u06a9\u062f \u062f\u0631\u0633\u062a \u0647\u0645\u0627\u0646\u0637\u0648\u0631 \u06a9\u0647 \u062f\u0631 \u0627\u06cc\u0646\u062c\u0627 \u062a\u0648\u0633\u0637 NativeScript Docs \u062a\u0648\u0635\u06cc\u0647 \u0634\u062f\u0647 \u0627\u0633\u062a \u0627\u0633\u062a\u0641\u0627\u062f\u0647 \u062e\u0648\u0627\u0647\u06cc\u0645 \u06a9\u0631\u062f<\/p>\n<h3><span class=\"ez-toc-section\" id=\"%D8%A8%D8%B1%D9%86%D8%A7%D9%85%D9%87_%D8%AE%D9%88%D8%AF_%D8%B1%D8%A7_%D8%AA%D8%B3%D8%AA_%DA%A9%D9%86%DB%8C%D8%AF%D8%8C_%D8%A7%D8%AC%D8%B1%D8%A7_%DA%A9%D9%86%DB%8C%D8%AF\"><\/span>\n<p>  \u0628\u0631\u0646\u0627\u0645\u0647 \u062e\u0648\u062f \u0631\u0627 \u062a\u0633\u062a \u06a9\u0646\u06cc\u062f\u060c \u0627\u062c\u0631\u0627 \u06a9\u0646\u06cc\u062f:<br \/>\n<span class=\"ez-toc-section-end\"><\/span><\/h3>\n<p><code>ns run android<\/code><\/p>\n<p>\u0627\u06af\u0631 \u0645\u0634\u06a9\u0644\u06cc \u062f\u0631 \u0627\u062c\u0631\u0627\u06cc \u0628\u0631\u0646\u0627\u0645\u0647 \u062e\u0648\u062f \u062f\u0627\u0631\u06cc\u062f\u060c \u0644\u0637\u0641\u0627\u064b \u0628\u0647 GitHub \u0645\u0646 \u0645\u0631\u0627\u062c\u0639\u0647 \u06a9\u0646\u06cc\u062f. <\/p>\n<p>\u0646: \u062f\u0641\u0639\u0647 \u0628\u0639\u062f \u0628\u0631\u0646\u0627\u0645\u0647 \u062e\u0648\u062f \u0631\u0627 \u0645\u0646\u062a\u0634\u0631 \u062e\u0648\u0627\u0647\u06cc\u0645 \u06a9\u0631\u062f \u067e\u0633 \u0628\u0627 \u0645\u0627 \u0647\u0645\u0631\u0627\u0647 \u0628\u0627\u0634\u06cc\u062f&#8230;<\/p>\n<\/p><\/div>\n","protected":false},"excerpt":{"rendered":"<p>\u06a9\u0627\u0631 \u0627\u0645\u0631\u0648\u0632 \u0645\u0627 \u062a\u0646\u0638\u06cc\u0645 \u0637\u0631\u062d \u0628\u0631\u0646\u0627\u0645\u0647 \u0628\u0627\u0644\u06cc\u0646\u06cc \u0646\u0647\u0627\u06cc\u06cc \u062e\u0648\u0627\u0647\u062f \u0628\u0648\u062f \u06a9\u0647 \u0686\u0646\u062f \u0631\u0648\u0632 \u067e\u06cc\u0634 \u062a\u0635\u0645\u06cc\u0645 \u06af\u0631\u0641\u062a\u06cc\u0645 \u0628\u0633\u0627\u0632\u06cc\u0645. \u0645\u0627 \u062a\u0648\u0627\u0628\u0639 \u06a9\u0645\u06a9\u06cc \u0648 \u0628\u0631\u062e\u06cc \u0627\u0632 \u0642\u0648\u0627\u0646\u06cc\u0646 CSS \u0631\u0627 \u0645\u06cc \u0646\u0648\u06cc\u0633\u06cc\u0645. \u0647\u0641\u062a\u0647 \u06af\u0630\u0634\u062a\u0647\u060c \u0641\u0627\u06cc\u0644 \u0647\u0627\u06cc \u0632\u0627\u0648\u06cc\u0647 \u0627\u06cc \u0632\u06cc\u0627\u062f\u06cc \u0646\u0648\u0634\u062a\u06cc\u0645 \u0648 \u0632\u0645\u0627\u0646 \u0622\u0646 \u0641\u0631\u0627 \u0631\u0633\u06cc\u062f\u0647 \u0627\u0633\u062a \u06a9\u0647 \u0631\u0648\u06cc \u0631\u0627\u0628\u0637 \u06a9\u0627\u0631\u0628\u0631\u06cc \u062a\u0645\u0631\u06a9\u0632 \u06a9\u0646\u06cc\u0645. \u062f\u0631 \u067e\u0627\u06cc\u0627\u0646 \u0627\u06cc\u0646 \u0645\u0642\u0627\u0644\u0647\u060c \u0628\u0627\u06cc\u062f \u0627\u067e\u0644\u06cc\u06a9\u06cc\u0634\u0646\u06cc \u0634\u0628\u06cc\u0647 &hellip;<\/p>\n","protected":false},"author":2,"featured_media":10287,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"fifu_image_url":"","fifu_image_alt":"","footnotes":""},"categories":[339],"tags":[],"class_list":["post-10286","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-dev"],"_links":{"self":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/posts\/10286","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/comments?post=10286"}],"version-history":[{"count":0,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/posts\/10286\/revisions"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/media\/10287"}],"wp:attachment":[{"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/media?parent=10286"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/categories?post=10286"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/nabfollower.com\/blog\/wp-json\/wp\/v2\/tags?post=10286"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}