繁体   English   中英

Android Studio 中的颜色预览

[英]Color preview in Android Studio

有没有办法在编辑器窗口左装订线中查看定义为 ARGB 颜色的integer variablescolor preview
我的意思是类似于注册为资源的颜色预览。

在此处输入图片说明

这是一个经过Photoshop处理的屏幕截图,它准确地显示了我的意思。

仅可能将颜色注册为资源(由开发人员在colors.xml 中注册或作为某些Android 资源存在)。

有关更多信息,请参阅下面给出的此链接。

有没有一种简单的方法可以在 Android Studio 中查看颜色?

如果您事先知道所有颜色,请将所有颜色导入到colors.xml文件中,然后每次使用颜色时,它都会显示在左侧。 代码如下所示:

public static void obsidian(ucTheme theme) {
    theme.background_color = R.color.obsidian;
    theme.id = 1000;
}  

最终结果将是这样的: 在此处输入图片说明

int ARGB 值不可能,因为 IDE 无法理解它们是颜色,它们可能只是数字! 相反,当您引用资源时,它可以在装订线中显示颜色预览,因为在解析R.color.yourColor ,IDE 通过限定符R.color而不是R.dimen或其他东西理解它是一种颜色。
或者,您可以查看此处为 Android Studio 编写一个插件,它可以帮助您获得所需的结果。

使用 javascript 显示 AndroidStudio colors.xml

在此处输入图片说明

我制作了一个 scriptfile.html ,[包含文件中的所有 javascript] 来查看来自 AndroidStudio 的 colors.xml 整数变量的颜色预览。

我将 colors.xml 粘贴到脚本文件 id="filexml" 中的一个 << div >> 中,解析 xml 并使 sam << div >> 使用:color | 十六进制 | 姓名

希望它有帮助:[编辑代码剪断]

 <!DOCTYPE html><html><head><!-- https://www.hexcolortool.com/ XML to json: https://codeload.github.com/andrewhouser/xmlToJson/zip/master --> <style> /* whitespacenowrap _ parent */ .whitespacenowrap_parent { white-space: nowrap; /* border:1px solid yellow; */ margin:0px; padding:0px; } /* inlineblock _ child */ .inlineblock_child { height: 17px; display: inline-block; border-top: 1px solid silver; margin:0px; padding-left:5px; } .width_hex_color{ width: 66px; } .width_name{width: 473px; /* border-top:0px; */ } </style></head><body><h5 style="color:#FF9500; margin:2px;">AndroidStudio colors.xml &nbsp; <span style="color:#33C458"> copy AndroidStudio colors.xml, to here, in this file, in <&lt;div id="filexml"&gt;>, and show Colors Hex and Names, dont need first line <&lt;?xml version="1.0" encoding="utf-8"?&gt;></span></h5> <button onclick="show_colors_xml_Android_Studio()" >show_colors_xml_Android_Studio</button> <div id="color_div" ></div> <pre><div id="outprn"></div></pre> <pre><div id="temp_test_div_id"> temp_test_div_id <div class="whitespacenowrap_parent"><div class="inlineblock_child width_hex_color">1047</div><div class="inlineblock_child width_hex_color" style="background:#6C6C70;">&nbsp;</div><div class="inlineblock_child width_hex_color">#6C6C70</div><div class="inlineblock_child width_name">colorGray2c</div></div><div class="whitespacenowrap_parent"><div class="inlineblock_child width_hex_color">1048</div><div class="inlineblock_child width_hex_color" style="background:#48484A;">&nbsp;</div><div class="inlineblock_child width_hex_color">#48484A</div><div class="inlineblock_child width_name">colorGray3c</div></div> temp_test_div_id </div></pre> <pre> <!-- ############################## ############################ ########################### ########################## ######################### ######################## ####################### paste colors.xml AndroidStudio in div id="filexml" --><div id="filexml"> <?xml version="1.0" encoding="utf-8"?> <resources> <color name="colorPrimary">#545456</color> <color name="colorPrimaryDark">#545456</color> <color name="colorAccent">#fbd7bd</color> <color name="colorDummyBeginOriginalAndroidStudioColors">#ff0bff</color> <color name="colorPrimaryDarkAStudio">#3700B3</color> <color name="colorPrimaryAStudio">#6200EE</color> <color name="colorAccentAStudio">#03DAC5</color> <color name="colorDummyEndOriginalAndroidStudioColors">#ff0eff</color> <color name="colorGreenAccentAStudioa">#03DAC5</color> <color name="colorWhiteGreenc">#addac5</color> <color name="colorGreena">#33C458</color> <color name="colorGreenc">#30D158</color> <color name="colorGreenMidnighta">#4e5850</color> <color name="colorGreenMidnightc">#004953</color> <color name="colorBlueTeala">#5AC8FA</color> <color name="colorBlueTealc">#64D2FF</color> <color name="colorBluePantoned">#5EB0E5</color> <color name="colorBluec">#0A84FF</color> <color name="colorBluea">#007AFF</color> <color name="colorBlueIndigoc">#5E5CE6</color> <color name="colorBlueIndigoa">#5856D6</color> <color name="colorBlueb">#0040DD</color> <color name="colorBlueTealDarkd">#0071A4</color> <color name="colorBlueDarkc">#010f8a</color> <color name="colorBlueIndigoDarkb">#3634A3</color> <color name="colorBluePrimaryDarkAStudioa">#3700B3</color> <color name="colorBluePurpleb">#8944AB</color> <color name="colorBluePurpleVioletDark">#8944AB</color> <color name="colorBluePurplec">#BF5AF2</color> <color name="colorBluePurplea">#AF52DE</color> <color name="colorPinkd">#FF6482</color> <color name="colorRedsystemc">#FF453A</color> <color name="colorPinka">#FF375F</color> <color name="colorRedsystema">#FF3B30</color> <color name="colorPinkc">#FF375F</color> <color name="colorPinkb">#D30F45</color> <color name="colorRedPantonee">#BA0C2E</color> <color name="colorGraySpacegraySilverc">#52514f</color> <color name="colorGraySilverc">#52514f</color> <color name="colorGrayb">#6C6C70</color> <color name="colorGray2a">#8E8E93</color> <color name="colorGray3b">#AEAEB2</color> <color name="colorGray3a">#C7C7CC</color> <color name="colorGray4a">#D1D1D6</color> <color name="colorGray5a">#E5E5EA</color> <color name="colorGrey6b">#EBEBF0</color> <color name="colorGrey6a">#F2F2F7</color> <color name="colorWhitePantonec">#F9F6EF</color> <color name="colorGraySilverSystemc">#ebebef</color> <color name="colorGraySilverSystema">#ebebe3</color> <color name="colorSilverPantonea">#E4E4E2</color> <color name="colorGrayc">#98989D</color> <color name="colorGraya">#8E8E93</color> <color name="colorGray2c">#6C6C70</color> <color name="colorGray3d">#545456</color> <color name="colorGray3c">#48484A</color> <color name="colorGray4c">#3A3A3C</color> <color name="colorGray5c">#2C2C2E</color> <color name="colorGrey6c">#1C1C1E</color> <color name="colorGrey6d">#242426</color> <color name="colorGolde">#fbd7bd</color> <color name="colorGoldRosePantoneb">#E6C7C2</color> <color name="colorWhiteRosea">#dbc1ef</color> <color name="colorYellowa">#FFCC00</color> <color name="colorYellowc">#FFD60A</color> <color name="colorRoseBrowna">#de9e95</color> <color name="colorGoldYellowBrowna">#b69221</color> <color name="colorOrangea">#FF9500</color> <color name="colorOrangeb">#FF9500</color> </resources> </div><!-- filexml end paste colors.xml AndroidStudio in div id="filexml" above ######################## ######################### ########################## ########################### ############################ ############################# ############################## --> <div id="outprn1"></div> <div id="outprn2"></div> <div id="outprn3"></div> <div id="outprn4"></div> <div id="outprn5"></div> <div id="outprn6"></div> <script type="text/javascript"> var filexml_is_empty=0; // on buttn click, or window.onload fires when the entire page loads (images, styles, etc.) : // window.onload = function show_colors_xml_Android_Studio() { if(filexml_is_empty)return; var debug=false; // console help search: if(debug) var str = document.getElementById("filexml").innerHTML; document.getElementById("temp_test_div_id").innerHTML=""; document.getElementById("filexml").innerHTML=""; filexml_is_empty=1; //clean string str because error in xmlToJson.parse() // console.log("String ori: ", str); strH = str.toHtmlEntitiesRemoveBadXMLchars(); // console.log("str toEntities: ", str); str = String.fromHtmlEntities(strH); // String is class obj ? // console.log("clean from htmlentities:", String.fromHtmlEntities(str)); // // strip xml header because error in strg xml to json xmlToJson.parse() str = str.match(/\\<resources([^\\]]*)resources\\>/); // document.getElementById("outprn3").innerHTML = str; // console.log("match str obj:", str); // regex match in first str[0] str=str[0]; var json = xmlToJson.parse( str ); // console.log("json: ", json); /***/ if(debug){ document.getElementById("outprn3").innerHTML='<br><h3>strH.toHtmlEntities: </h3>'+ strH; var jsonstr = JSON.stringify(json); jsonstr=jsonstr.replace(/\\[/gm,",[<br><br> "); jsonstr=jsonstr.replace(/\\]/gm,",<br> ]<br>"); jsonstr=jsonstr.replace(/,/gm,",<br> "); document.getElementById("outprn4").innerHTML='<br><h3>jsonstr:</h3>'+ jsonstr; console.log("match parse:", jsonstr); console.log("str:", str); console.log("json[0]", json[0]); // erster char!!!!! console.log('json["resources"]: ', json["resources"] );//color: array 3 console.log("json.resources: ", json.resources ); console.log("json.resources.color: ", json.resources.color ); console.log("json.resources.color[0]: ", json.resources.color[0] ); console.log("json.resources.color[0].name: ", json.resources.color[0].name ); console.log("json.resources.color[0].text: ", json.resources.color[0].text ); console.log("json.resources.color[1].name: ", json.resources.color[1].name ); console.log("json.resources.color[1].text: ", json.resources.color[1].text ); console.log("json.resources.color[2].name: ", json.resources.color[2].name ); console.log("json.resources.color[2].text: ", json.resources.color[2].text ); //console.log("json.resources.color[0][0]: ", json.resources.color[0][0] ); //undef //console.log("json.resources.color.name: ", json.resources.color.name ); //undef } /***/ console.log('Object.keys(json).length: ', Object.keys(json.resources.color).length )// 3 document.getElementById("outprn").innerHTML=' &nbsp; <small > Object.keys(json).length: '+ Object.keys(json.resources.color).length +'</small>'; var cdiv = document.getElementById("color_div").innerHTML; n=Object.keys(json.resources.color).length; // test XML problem: // n=n+2; //ok, til error, todo: error check for(let i=0; i<n; i++){ cdiv += color_num(i, json); // ok function til ERROR and show htm til error document.getElementById("color_div").innerHTML = cdiv; } } // ver_2 color name text move to right function color_num(n, json){ var color_div ='<div class="whitespacenowrap_parent">'; /* add line number 100+n /***/ color_div+='<div class="inlineblock_child width_hex_color" >'; color_div+=1001+n; color_div+='</div>'; /***/ color_div+='<div class="inlineblock_child width_hex_color" style="background:'; color_div+=json.resources.color[ n ].text; color_div+=';">&nbsp;</div><div class="inlineblock_child width_hex_color">'; color_div+=json.resources.color[ n ].text; color_div+='</div><div class="inlineblock_child width_name">'; color_div+=b6=json.resources.color[ n ].name; color_div+='</div></div>'; return color_div; } /** * Convert a string to HTML entities , ORIGINAL */ String.prototype.toHtmlEntities = function() { return this.replace(/[\\s\\S]/gm, function(s) { // return this.replace(/./gm, function(s) { // \\s Find a whitespace character // \\S Find a non-whitespace character // return "&#" + s.charCodeAt(0) + ";"; return (s.match(/[a-z0-9\\s]+/i)) ? s : "&#" + s.charCodeAt(0) + ";"; }); }; // add strip bad xml chars // Where he links to this article: http://www.w3.org/TR/xml/#charsets // Basically, all characters below 0x20 is disallowed, // except 0x9 (TAB), 0xA (CR?), 0xD (LF?) String.prototype.toHtmlEntitiesRemoveBadXMLchars = function() { // \\s Find a whitespace character // \\S Find a non-whitespace character [\\s\\S] //return this.replace(/./gm, function(s) { // [\\s\\S] return this.replace(/[\\s\\S]/gm, function(s) { // return "&#" + s.charCodeAt(0) + ";"; //add var q=s.charCodeAt(0); return (s.match(/[a-z0-9\\s]+/i)) ? s : s= ( q== 0x9 || q== 0xA || q== 0xD || ((q>= 0x20) && (q<= 0xD7FF)) || ((q>= 0xE000) && (q<= 0xFFFD)) || ((q>= 0x10000) && (q<= 0x10FFFF )) )? "&#" + s.charCodeAt(0) + ";" : "" ; }); }; /** * Create string from HTML entities */ String.fromHtmlEntities = function(string) { return (string+"").replace(/&#\\d+;/gm,function(s) { return String.fromCharCode(s.match(/\\d+/gm)[0]); }) }; </script></pre> <!-- this min version do not work here for me, so I copy xmlToJson.js to the end - -> <script type="text/javascript">if(typeof Object.assign!="function"){Object.defineProperty(Object,"assign",{value:function assign(r,n){"use strict";if(r==null){throw new TypeError("Cannot convert undefined or null to object")}var t=Object(r);for(var e=1;e<arguments.length;e++){var i=arguments[e];if(i!=null){for(var f in i){if(Object.prototype.hasOwnProperty.call(i,f)){t[f]=i[f]}}}}return t},t:true,i:true})}var xmlToJson=function(){var r=this;ru=function(r,n,t){if(!r[n]){r[n]=t}else{if(!Array.isArray(r[n])){var e=r[n];r[n]=[];r[n].push(e)}r[n].push(t)}};ro=function(r){var n=null;if(r&&typeof r==="string"){var t=new DOMParser;n=t.parseFromString(r,"application/xml")}return n};rl=function(r){var n=(r?r.ownerDocument||r:0).documentElement;return n?n.nodeName.toLowerCase()!=="html":false};rs=function(n){var t=n.attributes,e={};if(n.hasAttributes()){for(var i=0;i<t.length;i++){e[t[i].name]=rv(t[i].value)}}return e};rj=function(n,t){if(t.length>0){for(var e=0;e<t.length;e++){if(t[e].nodeType==1){rp(n,t[e])}}}};rp=function(n,t){var e=t.nodeName,i=Object.assign({},rs(t)),f=null;if(t.childNodes.length==1&&t.childNodes[0].nodeType==3){if(t.hasAttributes()){i["text"]=rv(t.childNodes[0].nodeValue)}else{i=rv(t.childNodes[0].nodeValue)}}else{rj(i,t.childNodes)}ru(n,e,i);return n};this.v=function(r){var n=Number(r);if(r.toLowerCase()==="true"||r.toLowerCase()==="false"){return r.toLowerCase()=="true"?true:false}return isNaN(n)?r:r.length==0?null:n};return{parse:function(n){if(n&&typeof n==="string"){ n=this.o(n)}return n&&r.l(n)?rp({},n.firstChild):null}}}();</script><!-- error this.o is not a function --> <!-- - -><script type="text/javascript" src="xmlToJson.js"></script><!-- --> <script type="text/javascript"> /** <!-- https://www.hexcolortool.com/ XML to json download https://codeload.github.com/andrewhouser/xmlToJson/zip/master --> */ /** * Object assign is required, so ensure that browsers know how to execute this method * * @method Object.assign * @returns {Function} */ if (typeof Object.assign != 'function') { // Must be writable: true, enumerable: false, configurable: true Object.defineProperty(Object, "assign", { value: function assign(target, varArgs) { // .length of function is 2 'use strict'; if (target == null) { // TypeError if undefined or null throw new TypeError('Cannot convert undefined or null to object'); } var to = Object(target); for (var index = 1; index < arguments.length; index++) { var nextSource = arguments[index]; if (nextSource != null) { // Skip over if undefined or null for (var nextKey in nextSource) { // Avoid bugs when hasOwnProperty is shadowed if (Object.prototype.hasOwnProperty.call(nextSource, nextKey)) { to[nextKey] = nextSource[nextKey]; } } } } return to; }, writable: true, configurable: true }); } /** * Object to convert XML into a structured JSON object * * @method xmlToJson * @returns {Object} */ var xmlToJson = (function () { var self = this; /** * Adds an object value to a parent object * * @method addToParent * @param {Object} parent * @param {String} nodeName * @param {Mixed} obj * @returns none */ self.addToParent = function (parent, nodeName, obj) { // If this is the first or only instance of the node name, assign it as // an object on the parent. if (!parent[nodeName]) { parent[nodeName] = obj; } // Else the parent knows about other nodes of the same name else { // If the parent has a property with the node name, but it is not an array, // store the contents of that property, convert the property to an array, and // assign what was formerly an object on the parent to the first member of the // array if (!Array.isArray(parent[nodeName])) { var tmp = parent[nodeName]; parent[nodeName] = []; parent[nodeName].push(tmp); } // Push the current object to the collection parent[nodeName].push(obj); } }; self.convertXMLStringToDoc = function (str) { var xmlDoc = null; if (str && typeof str === 'string') { // Create a DOMParser var parser = new DOMParser(); // Use it to turn your xmlString into an XMLDocument xmlDoc = parser.parseFromString(str, 'application/xml'); } return xmlDoc; } /** * Validates if an data is an XMLDocument * * @method isXML * @param {Mixed} data * @returns {Boolean} */ self.isXML = function (data) { var documentElement = (data ? data.ownerDocument || data : 0).documentElement; return documentElement ? documentElement.nodeName.toLowerCase() !== 'html' : false; }; /** * Reads through a node's attributes and assigns the values to a new object * * @method parseAttributes * @param {XMLNode} node * @returns {Object} */ self.parseAttributes = function (node) { var attributes = node.attributes, obj = {}; // If the node has attributes, assign the new object properties // corresponding to each attribute if (node.hasAttributes()) { for (var i = 0; i < attributes.length; i++) { obj[attributes[i].name] = self.parseValue(attributes[i].value); } } // return the new object return obj; }; /** * Rips through child nodes and parses them * * @method parseChildren * @param {Object} parent * @param {XMLNodeMap} childNodes * @returns none */ self.parseChildren = function (parent, childNodes) { // If there are child nodes... if (childNodes.length > 0) { // Loop over all the child nodes for (var i = 0; i < childNodes.length; i++) { // If the child node is a XMLNode, parse the node if (childNodes[i].nodeType == 1) { self.parseNode(parent, childNodes[i]); } } } }; /** * Converts a node into an object with properties * * @method parseNode * @param {Object} parent * @param {XMLNode} node * @returns {Object} */ self.parseNode = function (parent, node) { var nodeName = node.nodeName, obj = Object.assign({}, self.parseAttributes(node)), tmp = null; // If there is only one text child node, there is no need to process the children if (node.childNodes.length == 1 && node.childNodes[0].nodeType == 3) { // If the node has attributes, then the object will already have properties. // Add a new property 'text' with the value of the text content if (node.hasAttributes()) { obj['text'] = self.parseValue(node.childNodes[0].nodeValue); } // If there are no attributes, then the parent[nodeName] property value is // simply the interpreted textual content else { obj = self.parseValue(node.childNodes[0].nodeValue); } } // Otherwise, there are child XMLNode elements, so process them else { self.parseChildren(obj, node.childNodes); } // Once the object has been processed, add it to the parent self.addToParent(parent, nodeName, obj) // Return the parent return parent; }; /** * Interprets a value and converts it to Boolean, Number or String based on content * * @method parseValue * @param {Mixed} val * @returns {Mixed} */ this.parseValue = function (val) { // Create a numeric value from the passed parameter var num = Number(val); // If the value is 'true' or 'false', parse it as a Boolean and return it if (val.toLowerCase() === 'true' || val.toLowerCase() === 'false') { return (val.toLowerCase() == 'true'); } // If the num parsed to a Number, return the numeric value // Else if the valuse passed has no length (an attribute without value) return null, // Else return the param as is return (isNaN(num)) ? val.trim() : (val.length == 0) ? null : num; }; // Expose the API return { parse: function (xml) { if (xml && typeof xml === 'string') { xml = self.convertXMLStringToDoc(xml); } return (xml && self.isXML(xml)) ? self.parseNode({}, xml.firstChild) : null; } } })(); </script> </body></html>

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM