问题标签 [adobe-xd]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票
2 回答
1520 浏览

adobe-xd - 如何从 Adob​​e Xd 导出颜色资源?

我最近一直在 Adob​​eXD 中处理 UI,当我完成所有工作并准备导出到 Flutter 时,在测试时发生了一件烦人的事情。我意外地发现我的背景颜色不见了!我发现我没有选择export color assets. 不幸的是,这并没有解决我的问题。

0 投票
1 回答
925 浏览

javascript - 展平 SVG 中的变换属性

我在 adobe XD 中创建了一个矢量,然后将其导出为 SVG 文件。问题是在组元素中的 SVG 文件中<g>有这样的内联变换属性集

SVG 片段

所以当我为元素设置一个动画类来为我的 SVG 设置动画时,它的行为不符合预期。动画发生,但元素的位置可能会发生变化,因为一旦我在外部 CSS 中transform: translate通过,初始属性就会被 new 覆盖。@keyframes我该如何解决这个问题?

我在这里找到了类似的答案,但它适用于 Inkspsce,我目前只能访问 Adob​​e Illustrator 和 Adob​​e XD。另外,这个答案对我来说不是很清楚,因为我不熟悉 Inkspace。如何通过更新element 的子元素中transform: "translate "的属性来展平这些属性,同时确保 SVG 中的元素保留在它们的位置d

@keyframe在应用任何动画 之前,我的 SVG 看起来像这样在此处输入图像描述

但是一旦我将动画属性添加到 SVG 元素(使用交集观察器),假设我的代码应用于具有 id 的元素House,它只是从原始位置转移,因为 SVG 文件中提到的原始变换属性被我自己覆盖翻译:我在 CSS 中的 @keframe 动画中设置的转换属性

所以在动画之后,SVG 看起来像这样:

在此处输入图像描述

我使用了来自animista的自动生成动画

导致 SVG 中的项目的问题有一个 id="House" 并且动画类在 CSS 文件中 style.css 的第 179 行,类名**.slide-in-bottom**

0 投票
0 回答
174 浏览

image - 如何使用 Flutter 插件将 adobexd 方向缩放原型导出到 Flutter

我在 adobe xd 中创建了许多原型,图像可横向滚动,我使用了颤振插件,但无法看到与在 adobe xd 中看到的完全相同的原型,如何将滚动功能从 adobe xd 导出到扑?

0 投票
1 回答
268 浏览

css - 以编程方式将自定义 css 设计标记添加到 material-ui 组件

我在我的 react-redux 应用程序中使用了 material-ui 组件。我使用 adobe-xd 创建了 UI 原型,它提供了以 css 文件形式导出字符样式(设计标记)的选项:

有什么方法可以以编程方式导入字符样式(和颜色样式)的自定义 CSS 值,以反映在我所有的 Material-ui 组件中?比如各种设计令牌注入?每次我对 adobe-xd 原型进行更改并保存新的 css 时,它应该从该 css 导入值并反映在 material-ui 组件中。您还可以建议是否有更好的方法来实现从原型(adobe-xd)到代码库(反应 UI 框架)的设计令牌

0 投票
1 回答
26 浏览

user-interface - 根据 IBM 碳设计系统,应用程序标题栏的尺寸应该是多少?

我正在使用 IBM CDS 设计应用程序的 UI。它为所有项目提供了样式指南,但是我找不到标题栏的尺寸。

0 投票
1 回答
175 浏览

adobe-xd - 如何在图像的 XD 上提取屏幕区域

我刚从设计师那里收到 XD 文件,现在正在尝试从画布中提取导航区域图像,但是图像从画布中展开太分散了,如何将其裁剪到导航区域。

在此处输入图像描述

0 投票
1 回答
335 浏览

flutter - 使用不包含 MediaQuery 的上下文调用 MediaQuery.of()

我最近在看一个视频,使用 Flutter 将 adobe xd 原型转换为应用程序。但是我收到了这个错误:

使用不包含 MediaQuery 的上下文调用 MediaQuery.of()。从传递给 MediaQuery.of() 的上下文开始,找不到任何 MediaQuery。这可能是因为您没有 WidgetApp 或 MaterialApp 小部件(这些小部件引入了 MediaQuery),或者如果您使用的上下文高于这些小部件,则可能会发生这种情况。使用的上下文是:脚手架

这是我的代码:

0 投票
1 回答
252 浏览

react-native - 如何将 Adob​​e XD 颜色转换为原生反应代码?

我使用 Adob​​e Xd 设计了一个应用程序,我正在寻找一种尽可能多地转换它的方法,以便于编码工作。特别是,我使用了 react Native Generator 插件来翻译我的观点。通过稍微修改代码并尝试将其集成到我的应用程序中,我意识到没有考虑背景颜色。有没有办法恢复这个?Ps:我是原生反应的初学者

0 投票
1 回答
1154 浏览

android-studio - Adobe XD 元素导出到颤动问题

问题 在 Adob​​e XD 中安装 Flutter Export 并在 Android Studio 中安装 Flutter 和 Dart 后,我​​想在 XD 中导出所有小部件。在即将出现的窗口中附加正确的文件夹后,将显示以下文本:“在 pubspec.yaml 中找不到依赖项条目:adobe_xd。” 有什么建议可以将其添加到 .yaml 文件中吗?因为我所有的尝试都失败了。感谢回复<3

0 投票
0 回答
466 浏览

html - 通过 CSS 在 Adob​​e XD 和 Web 上 Work Sans 字体的外观不同

所以我一直在 Adob​​e XD 上设计一个网站,然后使用 HTML/CSS 开发它。我一直在使用前端的基础框架。

我使用了“Work Sans”字体,并试图保持 CSS 和 XD 之间的所有内容相同。我的 CSS 包含相同的字体系列、字体大小、行间距、字体粗细、颜色和对齐方式。但是,它在实施时仍然看起来不同。

以下是 Adob​​eXD 和 CSS 中元素的屏幕截图。

Adobe XD

在此处输入图像描述

CSS

在此处输入图像描述

如您所见,CSS 版本中的字体看起来更细。\

这是 XD 字体设置的屏幕截图

在此处输入图像描述

这是我的 CSS(字体系列在单独的类中指定,但是,当我检查元素时,它显示为计算值)。

我怀疑这与“粗体罗马”与“粗体”有关?但是,CSS 不会接受“bold roman”作为有效条目。

到目前为止,我已经尝试将字体粗细设置为“粗体”和“800”,但它保持不变

我已经检查了所有内容,真的无法弄清楚出了什么问题。